I'd like to create, on the product page, a button that leads to a specific tab with id = "exampleid"like "Be the first to review this product".
The phtml file is this:

// @codingStandardsIgnoreFile  

 * @var $block \Magento\Catalog\Block\Product\View
    $_product = $block->getProduct();
        <?php if($_product->getData('exampleattribute')==1){?>
            <div id="exampleid">
               <?php echo $this->getLayout()->createBlock('Magento\Cms\Block\Block')->setBlockId('exampleblock')->toHtml();?>
        <?php } ?>

and the catalog_product_view.xml is 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">
        <referenceBlock name="product.info.details">
            <block class="Magento\Catalog\Block\Product\View" name="example.tab" template="Vendor_extension::exampletab.phtml" group="detailed_info">
                    <argument name="title" translate="true" xsi:type="string">Example tab</argument>
                    <argument name="sort_order" xsi:type="string">25</argument>                    

what is the correct and clean way to create a link that calls the id of the tab?
Thanks a lot to everyone ;)

1 Answer 1


As long as you don't need to animate the scroll an anchor tag with a href that matches the ID will do the job.

<a href="#exampleid">Click to go to tab</a>
  • Hi Ben, I also thought this was the solution, but it doesn't work :(
    – Donato P
    Commented Jun 5, 2020 at 8:46
  • If you open the DOM in Chrome's dev tools and hit CMD + F (or CTRL + F on Windows) and search for #exampleid (with your ID instead of example) does it return any results? This is core browser behaviour so the only reason it shouldn't work is if that element doesn't exist.
    – Ben Crook
    Commented Jun 5, 2020 at 8:58
  • I have tried several times, but I don't understand why it doesn't work. example: link the tag: <a id="personalizzazionebottone" class="action add" href="#personalizzazione.product">Personalizzazione</a> should open the tab: <div class="data item content" aria-labelledby="tab-label-personalizzazione.product" id="personalizzazione.product" data-role="content" role="tabpanel" aria-hidden="false" style="display: block;"></div> but it does not. My intent was to create a link like add a review
    – Donato P
    Commented Jun 5, 2020 at 9:07
  • It may be because of the dot in "personalizzazione.product", have you tried replacing that with a hyphen instead?
    – Ben Crook
    Commented Jun 5, 2020 at 9:35
  • yes, unfortunately that doesn't work either. I think he needs js to activate the tab. Thank you for your patience;)
    – Donato P
    Commented Jun 5, 2020 at 9:43

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.