Solved: Preview product information on catalogue

tim_muangkeo · ‎04-12-2018

I am fairly new to Magento 2 platform so excuse my lack of knowledge!

I am working on a project where I need to preview my products in its' own block on the product page. Ideally, this block would be between the product-info-main and product-info-detailed block.
What I plan on putting there is this Preview Product.

I understand I would need to create a template file and attach a block to the product page. I am a bit lost on how to go about doing this. I've been reading/studying Customizing layouts and it's been helpful for the time being. To speed up the learning process could someone point me in the right direction? Is there is an extension or plugin for this feature? the only one I could find is iCatalogue.

I am more than happy to send more information or pictures to clarify my goal. Let me know, thanks!

sivashchenko · ‎04-16-2018

Hey @tim_muangkeo,

To display the block over the tabs on a product page from your module you need to create MODULE_ROOT/view/frontend/layout/catalog_product_view.xml file with the following content:

<?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>
        <referenceContainer name="content">
            <block class="Magento\Framework\View\Element\Template" name="your.block.name" template="Your_Module::preview.phtml" after="product.info.media" before="product.info.details"/>
        </referenceContainer>
    </body>
</page>

Consider specifying appropriate block class and template references in the code snippet.

View solution in original post

sivashchenko · ‎04-16-2018

Hey @tim_muangkeo,

To display the block over the tabs on a product page from your module you need to create MODULE_ROOT/view/frontend/layout/catalog_product_view.xml file with the following content:

<?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>
        <referenceContainer name="content">
            <block class="Magento\Framework\View\Element\Template" name="your.block.name" template="Your_Module::preview.phtml" after="product.info.media" before="product.info.details"/>
        </referenceContainer>
    </body>
</page>

Consider specifying appropriate block class and template references in the code snippet.

Preview product information on catalogue

Preview product information on catalogue

Re: Preview product information on catalogue

Re: Preview product information on catalogue