How to Add Tab Content in Separate New Tab in Details Page – Magento 1

blockslayoutmagento-1tabs

On my product details page I have three tabs, with the help of the following code:

 <div class="product-collateral toggle-content tabs">
    <?php if ($detailedInfoGroup = $this->getChildGroup('detailed_info', 'getChildHtml')):?>
        <dl id="collateral-tabs" class="collateral-tabs">
            <?php foreach ($detailedInfoGroup as $alias => $html):?>
            <?php  
                    if(trim($html)=="") continue;           
            ?>
                <dt class="tab"><span><?php echo $this->escapeHtml($this->getChildData($alias, 'title')) ?></span></dt>
                <dd class="tab-container">
                    <div class="tab-content"><?php echo $html ?></div>
                </dd>
            <?php endforeach;?>
        </dl>
    <?php endif; ?>
</div>

The tab contents are like:

enter image description here

Now I want to create a new and separate product-collateral tab near the above mentioned tabs.

When I use the below line in catalog.xml it is adding the tab content to the same tab.

<action method="addToParentGroup"><group>detailed_info</group></action>

I want to create a separate tab like the above one, not add to the existing one.

How can this be done?

Best Answer

You have to create new Group for this. Add this to <catalog_product_view> handle.

<block type="catalog/product_view_description" name="product.description.sec" as="description_sec" template="catalog/product/view/description.phtml">
    <action method="addToParentGroup"><group>detailed_info_sec</group></action>
    <action method="setTitle" translate="value"><value>Description</value></action>
</block>
<block type="catalog/product_view_attributes" name="product.attributes.sec" as="additional_sec" template="catalog/product/view/attributes.phtml">
    <action method="addToParentGroup"><group>detailed_info_sec</group></action>
    <action method="setTitle" translate="value"><value>Additional Information</value></action>
</block>

Note, I have created a new group, named , detailed_info_sec, with two tabs, Description and Additional Information, you can add OR edit them as per your requirement.

To show this to frontend, add this block of code, to view.phtml

<div class="product-collateral toggle-content tabs">
    <?php if ($detailedInfoGroup = $this->getChildGroup('detailed_info_sec', 'getChildHtml')):?>
        <dl id="collateral-tabs-sec" class="collateral-tabs">
            <?php foreach ($detailedInfoGroup as $alias => $html):?>
                <dt class="tab"><span><?php echo $this->escapeHtml($this->getChildData($alias, 'title')) ?></span></dt>
                <dd class="tab-container">
                    <div class="tab-content"><?php echo $html ?></div>
                </dd>
            <?php endforeach;?>
        </dl>
    <?php endif; ?>
</div>
Related Topic