0

I need to add custom multiple tabs after product description. Could you please help me. Thanks in advance.

  • please share the screenshot where you want to add Or have u trying to default magento theme luma? – Amit Bera Aug 12 at 10:31
  • Hi Amit thanks for quick reply, after product description in product details page i want to add two tabs in which one tab has Faq and other has videos based on custom code. I have two modules for that and i am using two catalog_product_view.xml layout file either of one file is working but two tabs along product description is not displaying. – gajjala sandeep Aug 12 at 10:33
1

Try something like this:

<?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">
    <update handle="review_product_form_component"/>
    <body>
        <referenceBlock name="product.info.details">
            <block class="Namespace1\Module1\Block\Class1" name="name.of.tab.1" as="tab1" template="Namespace1_Module1::file1.phtml" group="detailed_info">
                <arguments>
                    <argument translate="true" name="title" xsi:type="string">Tab Title 1</argument>
                </arguments>
            </block>
            <block class="Namespace2\Module2\Block\Class2" name="product.attributes" as="additional" template="Namespace2_Module2::file2.phtml" group="detailed_info">
                <arguments>
                    <argument translate="true" name="title" xsi:type="string">Tab Title 2</argument>
                </arguments>
            </block>
        </referenceBlock>
    </body>
</page>
1

you can do it like so:

<referenceBlock name="product.info.details">
<block class="Module class" name="unique name" as="alias if you want" template="Magento_Catalog::product/view/attribute.phtml" group="detailed_info">
    <arguments>
        <argument name="css_class" xsi:type="string">class if you want to</argument>
        <argument name="at_label" xsi:type="string">none</argument>
        <argument name="title" translate="true" xsi:type="string">Tab title</argument>
        <argument name="sort_order" xsi:type="string">sort order numer</argument>
    </arguments>
</block>
</referenceBlock>

Check the Magento_Catalog::product/view/attribute.phtml file to see the structure magento uses and do something close to this and change the above code as you needed, I would leave the title param so the tab title would get set as needed

  • Hi @Vlad, How to add more than one I mean two tabs at a time? – gajjala sandeep Aug 12 at 10:40
  • I would siggest duplicating the block, that is the correct way of doing it – Vlad Patru Aug 12 at 10:41
  • I have two separate catalog_product_view.xml which has 1)Faq 2) Videos but only either one is displaying not two at a time. – gajjala sandeep Aug 12 at 10:42
  • so you have to catalog_product_view.xml in different modules? check if the block names are not the same, that might be the problem – Vlad Patru Aug 12 at 10:43
  • block names are different – gajjala sandeep Aug 12 at 10:51
1

Create Dynamic Custom Tabs on Product View Page

This is the only best solution I have ever seen for adding a tab in product details page. It is working in 2.3.2.

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.