Magento 2; add custom product tab

In Magento 2 to apply the new tab in product detail page is very easy task. Use below steps and check it out. It will display the tab in your theme.

  1. Create file if not exists; catalog_product_view.xml in the app/design/frontend/{vendor name}/{theme name}/Magento_Catalog/layout

In the file write / add  the below code: (if the file already has custom coding just place inside the body tag without the fist and last 2 lines)

<?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>      
        <referenceBlock name="product.info.details">
          <block class="Magento\Catalog\Block\Product\View" name="deliveryinfo.tab" as="deliveryinfo" template="product/view/delivery_info.phtml" group="detailed_info" >
             <arguments>
                <argument translate="true" name="title" xsi:type="string">Product Question</argument>
             </arguments>
          </block>
        </referenceBlock>
    </body>
</page>
  1. create the file delivery_info.phtml in the path app/design/frontend/{vendor name}/{theme name}/Magento_Catalog/templates/product/view.

In the file you can write any content or you can call the static block like this

<?php echo $block->getLayout()->createBlock('Magento\Cms\Block\Block')->setBlockId('delivery_info')->toHtml(); ?>
  1. delivery_info block we have to create in admin side Content/Block.
  2. OR: we load a product attribute (in this example: "the_story") into the tab with this code in the view: <?php echo $this->helper('Magento\Catalog\Helper\Output')->productAttribute($block->getProduct(), $block->getProduct()->getThe_story(), 'the_story') ?>

Empty caches and that's it.

Hebt u meer vragen? Een aanvraag indienen

Opmerkingen

Mogelijk gemaakt door Zendesk