1

I am trying to move the product title above the image.gallery but I cannot figure out how the XML file should be set up.

I am editing in the catalog_product_view.xml file.

The main page title div is: page.main.title. The image placeholder has 2 class options: gallery-placeholder and fotorama-item or fotorama.

<move element="page.main.title" destination="product.media" before="gallery-placeholder"/>

When I place it as the above line it doesn't display the title of the product anymore:

<!--
/**
 * Copyright © 2016 SW-THEMES. All rights reserved.
 * See COPYING.txt for license details.
 */
-->
<page layout="2columns-right" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <head>
        <script src="Magento_Catalog::js/jquery.zoom.min.js"/>
    </head>
    <body>

        <move element="product.info.stock.sku" destination="product.info.price" after="product.price.final"/>
        <move element="product.info.review" destination="product.info.main" before="product.info.price"/>
        <move element="catalog.product.related" destination="sidebar.additional" after="product_view_custom_block"/>
        <move element="product.info.overview" destination="product.info.main" after="product.info.review"/>
        <referenceContainer name="after.body.start">
            <block class="Magento\Catalog\Block\Product\View" name="product_custom" template="Magento_Catalog::product/view/product_custom.phtml" before="-"/>
            <block class="Smartwave\Porto\Block\Template" name="product_view_config" after="-" template="Magento_Catalog::product/view/config.phtml"/>
        </referenceContainer>
        <referenceContainer name="columns.top">
            <block class="Magento\Catalog\Block\Product\View" name="prev_next_products" template="Magento_Catalog::product/view/prev_next.phtml" before="-"/>
        </referenceContainer>
        <move element="prev_next_products" destination="product.info.main" before="-"/>
        <move element="page.main.title" destination="product.media" before="gallery-placeholder"/>
        <referenceContainer name="product.info.social">
            <block class="Smartwave\Porto\Block\Template" name="product_view_addthis_links" after="-" template="Magento_Catalog::product/view/addthis.phtml"/>
        </referenceContainer>
        <referenceContainer name="content">
            <block class="Smartwave\Porto\Block\RickSnippet" name="rich_snippet" template="Magento_Catalog::product/view/rich_snippet.phtml" before="-"/>
            <block class="Smartwave\Porto\Block\Template" name="product_view_main_custom_block" before="product.info.main" template="Magento_Catalog::product/view/main_custom_block.phtml"/>
            <block class="Smartwave\Porto\Block\Template" name="product_view_main_custom_block2" after="-" template="Magento_Catalog::product/view/main_custom_block2.phtml"/>
        </referenceContainer>
        <move element="product_view_main_custom_block2" destination="product.info.main" after="product.info.overview"/>
    </body>
</page>

This is my XML page layout.

My goal is to move the product title and review part above the image gallery:

Page layout

1 Answer 1

6

try changing your destination to product.info.media instead of product.media and add before product.info.media.image. Your code will be

<move element="page.main.title" destination="product.info.media" before="product.info.media.image"/>

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.