What am I doing wrong while trying move an element on the product view page in Magento 2

magento.stackexchange https://magento.stackexchange.com/questions/206117

  •  22-12-2020
  •  | 
  •  

Question

I'm trying to move the compare and wishlist buttons to below all of the content in the product info element.

In my theme's catalog_product_view.xml:

<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
  xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <move element="product.info.social" destination="product.info.main" after="product.info.overview"/>
    </body>
</page>

I know that the file is loading and that I can target the element because adding the below line will successfully remove the element. 

<referenceContainer name="product.info.social" remove="true"/>

I've tried almost every element in product.info.main and others but it doesn't want to move. What am I missing?

Edit. I may have an idea, I just don't know how to fix it.

It looks like in the base theme I am moving additional.attributes to up to the bottom of product.info.main. I am trying to move the social links below these attributes. it's almost as if it IS putting the social links at the bottom of product.info.main then additional.attributes is loading after.

If I use this, it does move the social links to the top of the page.

<move element="product.info.social" destination="product.info.main" before="-"/>

also, trying to move the product.info.social to below additional.attributes moves it below the footer. I'm so confused...

<move element="product.info.social" destination="additional.attributes" after="-"/>

----------------Edit------------------

I'm going to leave all of my thought's and troubleshooting above for others to follow. The problem was that a lot of the elements share similar class names in HTML and even in template hints. As it turns out some of the elements were previously moved. I just had to reference the correct blocks.

Was it helpful?

Solution

you can give the move like

<move element="product.info.social" destination="product.info.main" after="-"/>

So that the element will appear last

Licensed under: CC-BY-SA with attribution
Not affiliated with magento.stackexchange
scroll top