1

I want to show custom content on product page below the tabs section.

Basically I moved tabs and related product section in product info main area (right side) and now I want to add a custom content after tabs.

How to create a new .phtml file and call after tabs? Thanks

enter image description here

Edit

<body>
     <referenceBlock name="product.price.final" remove="true"/>
     <move element="product.info.stock.sku" destination="product.info.main" before="page.main.title" />
     <move element="breadcrumbs" destination="product.info.stock.sku" before="-" />
     <move element="product.info.social" destination="product.info.media" after="-" />
    <move element="product.info.details" destination="product.info.main" after="product_options_wrapper_bottom"/>
    <move element="catalog.product.related" destination="product.info.main" after="product_options_wrapper_bottom"/>
<referenceContainer name="product.info.main">
        <block class="Magento\Catalog\Block\Product\View" name="custom" after="product.info.details" template="product/view/giftitems.phtml"/>
    </referenceContainer>
</body>
Improve this question
3
  • Can you update your catalog_product_view.xml to your question?
    – Sukumar Gorai
    Nov 27, 2018 at 13:31
  • You have to overwrite catalog_product_view.xml file into your design folder and add new block to display your html content
    – Vignesh Bala
    Nov 27, 2018 at 13:32
  • Can you check my answer?
    – Sukumar Gorai
    Nov 27, 2018 at 13:47

2 Answers 2

Reset to default
2

Create a file with name catalog_product_view.xml under below path:

app/design/frontend/Vendor/theme/Magento_Catalog/layout/catalog_product_view.xml

add 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="product.info.main">
            <block class="Magento\Catalog\Block\Product\View" name="custom" after="product.info.details" template="product/view/text.phtml"/>
        </referenceContainer>
    </body>
</page>

Now create one file with name text.phtml under below path:

app/design/frontend/Vendor/theme/Magento_Catalog/templates/product/view/text.phtml

with content:

<?= __('Custom Text') ?>
<?php $_product = $block->getProduct(); //You can also use current product object by this code if needed. ?>

EDIT:

<body>
<referenceBlock name="product.price.final" remove="true"/>
<move element="product.info.stock.sku" destination="product.info.main" before="page.main.title" />
<move element="breadcrumbs" destination="product.info.stock.sku" before="-" />
<move element="product.info.social" destination="product.info.media" after="-" />
<move element="product.info.details" destination="product.info.main" after="product.info.overview"/>
<move element="catalog.product.related" destination="product.info.main" after="product.custom"/>

<referenceContainer name="product.info.main">
<block class="Magento\Catalog\Block\Product\View" name="product.custom" after="product.info.details" before="catalog.product.related" template="product/view/giftitems.phtml"/>
</referenceContainer>
</body>
Improve this answer
11
  • Working but showing before the tabs section, not after.
    – Shoaib Saleem
    Nov 27, 2018 at 13:56
  • Can you update your xml file to the question so that I can understand?
    – Sukumar Gorai
    Nov 27, 2018 at 13:57
  • I am not asking to update my given xml, I am asking to update your catalog_product_view.xml on which you have moved the tab section to right.
    – Sukumar Gorai
    Nov 27, 2018 at 14:06
  • See my edit xml.
    – Shoaib Saleem
    Nov 27, 2018 at 14:16
  • How did you move your tabs to right column? That code is not there in the xml?
    – Sukumar Gorai
    Nov 27, 2018 at 14:18
0

Add catalog_product_view.xml in your custom theme at below path and content:

app/design/frontend/{{package}}/{{theme}}/Magento_Catalog/layout/catalog_product_view.xml

<?xml version="1.0"?>
<page layout="1column" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceContainer name="product.info.main">
            <block class="Magento\Catalog\Block\Product\View" name="custom-text" template="product/view/custom.phtml" after="product.info.details"/>
        </referenceContainer>
    </body>
</page>

Add file custom.phtml at path

app/design/frontend/{{package}}/{{theme}}/Magento_Catalog/templates/product/view/custom.phtml

with required text/code.

Improve this answer
4
  • I tried but not showing anything.
    – Shoaib Saleem
    Nov 27, 2018 at 13:42
  • Updated my answer, check it.
    – Himmat Paliwal
    Nov 27, 2018 at 15:27
  • I want to show something after product.info.detail can i use this?
    – jibin george
    Jan 17, 2020 at 15:38
  • Yes, you can use above, however, let me know if it doesn't help..
    – Himmat Paliwal
    Jan 18, 2020 at 8:19

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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