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>
Aasim Goriya
5,4622 gold badges30 silver badges54 bronze badges
asked Nov 27, 2018 at 13:24
3
  • Can you update your catalog_product_view.xml to your question? Commented 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 Commented Nov 27, 2018 at 13:32
  • Can you check my answer? Commented Nov 27, 2018 at 13:47

2 Answers 2

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>
answered Nov 27, 2018 at 13:46
11
  • Working but showing before the tabs section, not after. Commented Nov 27, 2018 at 13:56
  • Can you update your xml file to the question so that I can understand? Commented 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. Commented Nov 27, 2018 at 14:06
  • See my edit xml. Commented Nov 27, 2018 at 14:16
  • How did you move your tabs to right column? That code is not there in the xml? Commented 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.

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

Your Answer

Draft saved
Draft discarded

Sign up or log in

Sign up using Google
Sign up using Email and Password

Post as a guest

Required, but never shown

Post as a guest

Required, but never shown

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

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.