0

I want to show content without tabs on product detail page. Magento shows description and reviews in tab on product detail page.

Is there any way we can remove the tab and show content vertically?

just like amazon: enter image description here

|improve this question
  • 1
    Check my answer and let me know if you have any issue – Prince Patel Jul 5 '18 at 8:01
  • 1
    Check my answer. Update me if you have any issues. – Sukumar Gorai Jul 5 '18 at 10:33
4

First remove description and review tabs from

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

<referenceBlock name="reviews.tab" remove="true" />
<referenceBlock name="product.info.description" remove="true" />

Now you can show description, more information, review.

<?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="content">
            <container name="product.atributes.block" htmlTag="div" htmlClass="product-atributes-blocks" after="product.info.details">
                <block class="Magento\Catalog\Block\Product\View\Attributes" name="product.attributes" as="additional" template="product/view/attributes.phtml" group="detailed_info">
                    <arguments>
                        <argument translate="true" name="title" xsi:type="string">More Information</argument>
                    </arguments>
                </block>
                <block class="Magento\Catalog\Block\Product\View\Description" name="product.info.description.full" template="product/view/attribute.phtml" group="detailed_info">
                    <arguments>
                        <argument name="at_call" xsi:type="string">getDescription</argument>
                        <argument name="at_code" xsi:type="string">description</argument>
                        <argument name="css_class" xsi:type="string">description</argument>
                        <argument name="at_label" xsi:type="string">Description</argument>
                        <argument name="title" translate="true" xsi:type="string">Details</argument>
                    </arguments>
                </block>

            </container>
        </referenceContainer>
        <referenceBlock name="reviews.tab" remove="true" />
        <referenceBlock name="product.info.description" remove="true" />
    </body>
</page>

Don't forget to flush the cache

|improve this answer
  • I placed same code which removes the tabs but doesn't add the description and reviews vertically without tabs – jack Jul 5 '18 at 9:13
1

You can use the below code in your module catalog_product_view.xml:

<?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>
        <referenceBlock name="product.info.details" remove="true"/>
        <referenceBlock name="product.info.overview" remove="true"/>
        <referenceBlock name="product.attributes" remove="true"/>
        <referenceBlock name="reviews.tab" remove="true"/>
        <referenceContainer name="content">
            <block class="Magento\Catalog\Block\Product\View\Description" name="product.description" template="Magento_Catalog::product/view/details.phtml" after="product.info.media">
                <arguments>
                    <argument name="at_call" xsi:type="string">getDescription</argument>
                    <argument name="at_code" xsi:type="string">description</argument>
                    <argument name="css_class" xsi:type="string">description</argument>
                    <argument name="at_label" xsi:type="string">none</argument>
                    <argument name="title" translate="true" xsi:type="string">Details</argument>
                </arguments>
            </block>
        </referenceContainer>
    </body>
</page>
|improve this answer

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.