|
I have discovered that to solve this problem you have to re:writing the drawItem() function in app\code\core\Mage\Catalog\Block\Navigation.php and create a custom phtml file for the new navigation.
-------------------------------------------------------------------------------------
Step One
Open app\code\core\Mage\Catalog\Block\Navigation.php and locate this block of code.
public function drawItem($category, $level=0, $last=false)
{
$html = '';
if (!$category->getIsActive()) {
return $html;
}
$children = $category->getChildren();
$hasChildren = $children && $children->count();
$html.= '<li';
if ($hasChildren) {
$html.= ' onmouseover="toggleMenu(this,1)" onmouseout="toggleMenu(this,0)"';
}
$html.= ' class="level'.$level;
$html.= ' nav-'.str_replace('/', '-', $category->getRequestPath());
if ($this->isCategoryActive($category)) {
$html.= ' active';
}
if ($last) {
$html .= ' last';
}
if ($hasChildren) {
$cnt = 0;
foreach ($children as $child) {
if ($child->getIsActive()) {
$cnt++;
}
}
$html .= ' parent';
}
$html.= '">'."\n";
$html.= '<a href="'.$this->getCategoryUrl($category).'"><span>'.$this->htmlEscape($category->getName()).'</span></a>'."\n";
//$html.= '<span>'.$level.'</span>';
if ($hasChildren){
$j = 0;
$htmlChildren = '';
foreach ($children as $child) {
if ($child->getIsActive()) {
$htmlChildren.= $this->drawItem($child, $level+1, ++$j >= $cnt);
}
}
if (!empty($htmlChildren)) {
$html.= '<ul class="level' . $level . '">'."\n"
.$htmlChildren
.'</ul>';
}
}
$html.= '</li>'."\n";
return $html;
}
...and replace it with...
public function drawItem($category, $level=0, $last=false)
{
$html = '';
if (!$category->getIsActive()) {
return $html;
}
$children = $category->getChildren();
$hasChildren = $children && $children->count();
$html.= '<li class="';
if ($hasChildren) {
$cnt = 0;
foreach ($children as $child) {
if ($child->getIsActive()) {
$cnt++;
}
}
}
if ($level == 0){
$html.= ' parent';
} else if ($level == 1) {
$html.= ' child';
} else if ($level == 2) {
$html.= ' grandchild';
}
if ($this->isCategoryActive($category)) {
$html.= ' active';
}
$html.= '">'."\n";
$html.= '<a href="'.$this->getCategoryUrl($category).'">
'.$this->htmlEscape($category->getName()).'</a>'."\n";
if ($hasChildren){
$j = 0;
$htmlChildren = '';
foreach ($children as $child) {
if ($child->getIsActive()) {
$htmlChildren.= $this->drawItem($child, $level+1, ++$j >= $cnt);
}
}
if (!empty($htmlChildren)) {
$html.= ''."\n"
.$htmlChildren
.'';
}
}
$html.= '</li>'."\n";
return $html;
}
-------------------------------------------------------------------------------------
Step Two
Create a new file with the following contents...
<?php
/*
* Right Side Simple Static Menu for store
* @see Mage_Catalog_Block_Navigation
*/
?>
<div class="right-nav-container">
<ul id="rightNav">
<?php foreach ($this->getStoreCategories() as $_category): ?>
<?php echo $this->drawItem($_category) ?>
<?php endforeach ?>
</ul>
</div>
Save the new file as Right.phtml in app\design\frontend\default\default\template\catalog\navigation
-------------------------------------------------------------------------------------
Step Three
Open app\design\frontend\default\default\layout\catalog.xml and locate the following code.
<reference name="right">
Directly underneath place this line of code...
<block type="catalog/navigation" name="catalog.rightnav" template="catalog/navigation/right.phtml"/>
This will call your new menu into the right sidebar, and the HTML code will look like this.
<li class="parent active">
<a href="...">Furniture</a>
</li>
<li class="child">
<a href="...">Living Room</a>
</li>
<li class="child">
<a href="...">Bedroom</a>
</li>
<li class="parent">
<a href="...">Electronics</a>
</li>
<li class="child">
<a href="...">Cell Phones</a>
</li>
<li class="child">
<a href="...">Cameras</a>
</li>
<li class="grandchild">
<a href="...">Accessories</a>
</li>
<li class="grandchild">
<a href="...">Digital Cameras</a>
</li>
-------------------------------------------------------------------------------------
Style as needed with CSS and you are done!
Enjoy!
|
