Categories
CMS Magento Mastering Development

Show blocks like JQuery UI Tabs on product detail page in magento 2

The related and alternate products blocks are showing as siblings one after the other. See current layout screenshot.

Current layout on product detail page

The code is inside catalog_product_view.xml:

<move element="catalog.product.related" destination="content" after="product.info.details" />

And

<referenceContainer name="content">
        <block as="productlist_product" class="Mcs\AlternateProduct\Block\ProductList\Product" name="catalog.product.alternate.product" template="Mcs_AlternateProduct::productlist/items.phtml" after="product.info.details" ifconfig="alternate_product/general/enabled" />
    </referenceContainer>

I want to display the Related Products & Alternate Products in JQuery UI tabs view form.

Leave a Reply

Your email address will not be published. Required fields are marked *