1

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:

 <?php
// @codingStandardsIgnoreFile  

/** 
 * @var $block \Magento\Catalog\Block\Product\View
 */
?>
<?php
    $_product = $block->getProduct();
?>
        <?php if($_product->getData('exampleattribute')==1){?>
            <div id="exampleid">
               <?php echo $this->getLayout()->createBlock('Magento\Cms\Block\Block')->setBlockId('exampleblock')->toHtml();?>
          </div>                 
        <?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">
    <body>
        <referenceBlock name="product.info.details">
            <block class="Magento\Catalog\Block\Product\View" name="example.tab" template="Vendor_extension::exampletab.phtml" group="detailed_info">
                <arguments>
                    <argument name="title" translate="true" xsi:type="string">Example tab</argument>
                    <argument name="sort_order" xsi:type="string">25</argument>                    
                </arguments>
            </block>
   </referenceBlock>
   </body>
</page>

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

0

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>
| improve this answer | |
  • Hi Ben, I also thought this was the solution, but it doesn't work :( – Donato P Jun 5 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 Jun 5 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 Jun 5 at 9:07
  • It may be because of the dot in "personalizzazione.product", have you tried replacing that with a hyphen instead? – Ben Crook Jun 5 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 Jun 5 at 9:43

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.