Question

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.

Was it helpful?

Solution

You're almost there :-)

As you're adding code into the layout template view, you need to modify you layout XML to add your block as a child of the root element:

layout/page.xml (or local.xml)

<reference name="root">
     <block type="catalog/navigation" name="mtopsub" as="mtopsub"
            template="catalog/navigation/topsub.phtml" /> 
</reference>

Now when you call:

<?php echo $this->getChildHtml('mtopsub') ?>

inside your layout template, the block will be available and should render correctly.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top