I am trying to create a sub navigation of the main navigation in Magento and insert it before the breadcrumbs module. So when you navigate to the root catalogue a sub menu of its main child categories appears as a navigation bar above the breadcrumbs but below the root navigation. In the catalogue you click the root category and all main categories under the root category appear as a horizontal navigation bar below it.
I am only able to insert it under the category title but not above the breadcrums module. I created app/design/frontend/theme/template/catalog/navigation/topsub.phtml and entered the following code:
<?php
//get all sub categories for current category
$_category = $this->getCurrentCategory();
$_category_children = $_category->getChildren();
$catIds = explode(',',$_category_children);
$categories = array();
foreach($catIds as $catId) {
$category = Mage::getModel('catalog/category')->load($catId);
$categories[$category->getName()] = array(
'url' => $category->getUrl(),
'img' => $category->getImageUrl()
);
}
?>
<ul class="subnav">
<?php if($category->getIsActive()): ?>
<?php foreach($categories as $name => $data): ?>
<li>
<a href="<?php echo $data['url']; ?>" title="<?php echo $name; ?>" alt="<?php echo $name; ?>">
<img src="<?php echo $data['img']; ?>" />
<div class="category-title"><?php echo $name; ?></div>
</a>
<span>/ </span>
</li>
<?php endforeach; ?>
<?php endif; ?>
</ul>
In my local.xml I have entered
<reference name="mtopsub">
<block type="catalog/navigation" name="topsub" as="topsub" template="catalog/navigation/topsub.phtml"/>
</reference>
In my template file I have called it
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $this->getLang() ?>" lang="<?php echo $this->getLang() ?>">
<head>
<?php echo $this->getChildHtml('head') ?>
</head>
<body<?php echo $this->getBodyClass()?' class="'.$this->getBodyClass().'"':'' ?>>
<?php echo $this->getChildHtml('after_body_start') ?>
<div class="wrapper">
<?php echo $this->getChildHtml('global_notices') ?>
<div class="page">
<?php echo $this->getChildHtml('header') ?>
<div class="main-container col1-layout">
<div class="main">
<div class="msubnav">
<?php echo $this->getChildHtml('mtopsub') ?>
</div>
<?php echo $this->getChildHtml('breadcrumbs') ?>
<div class="col-main">
<?php echo $this->getChildHtml('global_messages') ?>
<?php echo $this->getChildHtml('content') ?>
</div>
</div>
</div>
<?php echo $this->getChildHtml('footer') ?>
<?php echo $this->getChildHtml('before_body_end') ?>
</div>
</div>
<?php echo $this->getAbsoluteFooter() ?>
</body>
</html>
Now until this point nothing appears. If I create a static block and enter the following code to it:
<p>{{block type="catalog/navigation" name="catalog.navigation" template="catalog/navigation/topsub.phtml"}}</p>
The sub navigation menu appears as it should but in the wrong position. Instead of appearing above the breadcrumbs module it appears below it and below the Category page Title.
I am sure I am missing something, if anyone can point me in the right direction I would greatly appreciate it.