I need to convert related products section to custom tab in products detail page in magento 2
2 Answers
you can try this one,
put this code on app/design/frontend/vendor/your theme/view/frontend/catalog_product_view.xml
<!-- Create new tab--> <referenceBlock name="product.info.details"> <block class="Magento\Catalog\Block\Product\View" name="custom.tab" as="custominfo" template="Magento_Catalog::product/related-products.phtml" group="detailed_info" > <arguments> <argument translate="true" name="title" xsi:type="string">Related Products</argument> </arguments> </block> </referenceBlock> <!-- Move the content--> <move element="catalog.product.related" destination="product.info.details" /> Call the function in phtml file
<?php echo $this->getBlockHtml('catalog.product.related'); ?> You need to override catalog_product_view.xml file under:
app/design/frontend/Vendor/Theme/Magento_Catalog/layout/catalog_product_view.xml
and use the code below:
<?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="catalog.product.related" remove="true"/> <referenceBlock name="product.info.details"> <block class="Magento\Catalog\Block\Product\ProductList\Related" name="catalog.product.related.custom.tab" template="Magento_Catalog::product/list/items.phtml" after="-" group="detailed_info"> <arguments> <argument name="type" xsi:type="string">related</argument> <argument translate="true" name="title" xsi:type="string">Related Products(Put your custom tab title here)</argument> </arguments> <block class="Magento\Catalog\Block\Product\ProductList\Item\Container" name="related.product.addto" as="addto"> <block class="Magento\Catalog\Block\Product\ProductList\Item\AddTo\Compare" name="related.product.addto.compare" as="compare" template="Magento_Catalog::product/list/addto/compare.phtml"/> </block> </block> </referenceBlock> </body> </page> Hope this will help you!