Unfortunately, Magento is not providing such feature out of box. However you can make this work without creating a module actually. I will show you one of such method here.
Step 1 : Use local.xml
to update detailed_info
child groups
Explanation : You may be wondering now, what the hell is this detailed_info
child group ! Well it is a long story, the key point that you need to understand here is, those tabs that you are viewing in product view page in default Magento 1.9.* are actually children of detailed_info
group. In short, you can create such block groups and set it with a parent block. Later you can collect those block group from the parent block and do whatever you want with them. In case of product view page, Mage_Catalog_Block_Product_View
block holds such a child group whose name is detailed_info
(refer : app/design/frontend/rwd/default/layout/catalog.xml
) and then use this child group to create the tabs (refer : app/design/frontend/rwd/default/template/catalog/product/view.phtml
)
This is the theory and now why we need to update this child group ? Good question. Well, we are now going to set a new property active_tab
(using magic methods) in the children blocks of the group detailed_info
so that we can later use this to determine, which is the active block (or tab) which need to be activated by default.
File : app/design/frontend/rwd/default/layout/local.xml
<layout>
<catalog_product_view>
<reference name="product.description">
<action method="setActiveTab"><active_tab>0</active_tab></action>
</reference>
<reference name="product.attributes">
<action method="setActiveTab"><active_tab>1</active_tab></action>
</reference>
<reference name="product.reviews">
<action method="setActiveTab"><active_tab>1</active_tab></action>
</reference>
<reference name="product.info">
<block type="core/template" name="product.view.activetab" as="active_tab" template="custom/catalog/product/view/activetab.phtml"></block>
</reference>
</catalog_product_view>
</layout>
Here two points to note.
Point 1: We are updating default child blocks of the group detailed_info
with <action method="setActiveTab"><active_tab>0 | 1</active_tab></action>
. As you can see, review block holds 1 as its value.
Point 2 : You can also see a new block inclusion inside the layout update. The block which is included in the layout has name product.view.activetab
and which is a children of product.info
block (block which holds detailed_info
blocks group). This block is going to hold the default active tab logic.
Step 2 : Call our new block in product view block
Explanation : So we defined a new block via layout update. We need to call our new block manually in view.phtml
file so that, our block get used while generating the product view page content. Let us do that.
File : app/design/frontend/rwd/default/template/catalog/product/view.phtml
<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):?>
<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; ?>
<? /** calling our block here **/ ?>
<?php echo $this->getChildHtml('active_tab') ?>
</div>
I have shown you where should we call our new block. All the above codes except the part <?php echo $this->getChildHtml('active_tab') ?>
is present in view.phtml
.
Step 3 : Include default active tab Logic via new block template
Explanation : Now our block is included in the product view page. It is the time to define our new block template, in order to do the "magic".
File : app/design/frontend/rwd/default/template/custom/catalog/product/view/activetab.phtml
<?php if ($detailedInfoGroup = $this->getParentBlock()->getChildGroup('detailed_info')) : ?>
<?php $count = 0; ?>
<?php foreach ($detailedInfoGroup as $alias => $info) : ?>
<?php echo $count ?>
<?php if ($info->getActiveTab() == 1) : ?>
<script type="text/javascript">
//<![CDATA[
$j(document).ready(function() {
var titleLists = $j('.toggle-content ul > li');
var DTs = $j('.toggle-content dl > dt');
var DDs = $j('.toggle-content dl > dd');
var indexNum = parseInt(<?php echo (int)$count; ?>);
titleLists.removeClass('current');
DTs.removeClass('current');
DDs.removeClass('current');
titleLists.eq(indexNum).addClass('current');
DTs.eq(indexNum).addClass('current');
DDs.eq(indexNum).addClass('current');
});
//]]>
</script>
<?php break; ?>
<?php elseif ($info->getActiveTab() == null) : ?>
<?php $count-- ?>
<?php endif ?>
<?php $count++ ?>
<?php endforeach ?>
<?php endif ?>
What we are doing here is, we will collect the detailed_info
group, loop through the children blocks, find the active tab block and then set that tab as active by inserting a <script />
. That's it.
Now clear the cache and load the page again. You will see the magic.
Note : Please use my Gist for reference.