Magento 1.9 – Change Order of Tabs on Product Details Page

attributesmagento-1.9product-viewtabs

How do you change the order of the tabs on the product details page.

I created a new tab called 'Programs' by adding the below to my local.xml

<catalog_product_view translate="label">
    <reference name="product.info">
        <block type="catalog/product_view_description" name="product.programs" as="programs" template="catalog/product/view/programs.phtml">
            <action method="addToParentGroup"><group>detailed_info</group></action>
            <action method="setTitle" translate="value"><value>Programs</value></action>
        </block>
    </reference>
</catalog_product_view>

I aslo created a catalog/product/view/programs.phtml template in my theme.

In addition I created another tab called ingredients

Now I have 3 tabs on my product details page i.e. Description, Reviews, Programs & Ingredients.

How can I change the order to Programs Description Ingredients and Reviews?

Also, how can I link my the templates I created for these new tabs to a product attribute?

Best Answer

Use the before or after tag in your block. Here is an official guide to achieve that.

Example:

 <block type="cms/block" before="some-other-block" name="left.permanent.callout">

Related Solutions

Magento – Add Custom Product Tab in MAGENTO 1.9 CE

Please only ask one question at once. Anyway, here you go:

The following content for the local.xml works. It will add a new tab on the product page. If it does not work, your layout XML file is probably not loaded correctly.

<?xml version="1.0"?>
<layout version="0.1.0">
    <catalog_product_view>
        <reference name="product.info">
            <block type="catalog/product_view_attributes" name="features_product_tab" as="features_tab" template="catalog/product/view/features.phtml">
                <action method="addToParentGroup"><group>detailed_info</group></action>
                <action method="setTitle" translate="value"><value>Features</value></action>
            </block>
        </reference>
    </catalog_product_view>
</layout>

This is not possible in a nice way. But you could write something unique into the static block to mark it empty and then change the way Magento renders the tabs in order to hide "empty" tabs. Therefore, write e.g. EMPTY into the static block you do not want to be rendered. Magento will automatically add a paragraph tag around it, so it becomes <p>EMPTY</p>. Then, in your catalog/product/view.phtml change the tab rendering like that:

<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 ($html != '<p>EMPTY</p>'): ?>
                    <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 endif; ?>
            <?php endforeach;?>
        </dl>
    <?php endif; ?>
</div>

Magento – Magento 1.9 Product page customization

You can use the exactly same approach that is used for "Fabricante" You just need to change the attribute code for the new one, in the right template ie:

app/design/frontend/{package}/{theme}/templates/catalog/product/view.phtml

<div class="product-sarasa">
    <?php echo $_helper->productAttribute($_product, $_product->getSarasa(), 'sarasa') ?>
</div>

To find the right template file just activate "template hints" in:

System > Configuration > Advanced - Developer > Debug > Template Path Hints.

Best Answer

Related Solutions

Magento – Add Custom Product Tab in MAGENTO 1.9 CE

Magento – Magento 1.9 Product page customization

Related Topic