Category navigation in navigation child - php

Question

I have a problem with navigation in Magento. The child categories displays in a funny way, which i do not want them too. Please see the following screenshot:
http://tinypic.com/r/2l97byp/8
In upper left, the childs are shown in the menu. However i do not want them to expanding into a new block, but simply show below their parrent category as seen in this picture:
tinypic.com/r/16l0kk3/8
I have two sets of code for this, however i do not know what to edit to get the desired result. I have tried to get it to work, but with no luck.
The two code parts:
top.phtml:
<?php
/**
* Top menu for store
*
* #see Olegnax_Navigation_Block_Navigation
*/
?>
<?php
/**
* $this->renderCategoriesMenuHtml() supports optional arguments:
* int Level number for list item class to start from
* string Extra class of outermost list items
* string If specified wraps children list in div with this class
*/
?>
<!-- navigation BOF -->
<?php $_menu = $this->renderCategoriesMenuHtml(0, 'level-top', 'sub-wrapper' ) ?>
<?php if($_menu): ?>
<nav class="olegnax">
<ul id="nav">
<?php if (Mage::getStoreConfig('celebritysettings/celebritysettings_header/navigation_home')): ?>
<li class="level0 level-top">
<span><?php echo $this->__('Home'); ?></span>
</li>
<?php endif; ?>
<?php
echo $_menu;
$custom_tab = Mage::getModel('cms/block')->load('celebrity_navigation_block');
if($custom_tab->getIsActive()) {
echo '
<li class="level0 level-top parent custom-block">
<a href="#" class="level-top">
<span>'.$custom_tab->getTitle().'</span>
</a>
<div class="sub-wrapper">'.$this->getLayout()->createBlock('cms/block')->setBlockId('celebrity_navigation_block')->toHtml().'</div>
</li>';
}
?>
</ul>
</nav>
<?php endif ?>
<!-- navigation EOF -->
And Navigation.phtml:
<?php
/**
* #version 1.0 12.0.2012
* #author Olegnax http://www.olegnax.com <mail#olegnax.com>
* #copyright Copyright (C) 2010 - 2012 Olegnax
*/
class Olegnax_Navigation_Block_Navigation extends Mage_Catalog_Block_Navigation
{
/**
* columns html
*
* #var array
*/
protected $_columnHtml;
/**
* Render category to html
*
* #param Mage_Catalog_Model_Category $category
* #param int Nesting level number
* #param boolean Whether ot not this item is last, affects list item class
* #param boolean Whether ot not this item is first, affects list item class
* #param boolean Whether ot not this item is outermost, affects list item class
* #param string Extra class of outermost list items
* #param string If specified wraps children list in div with this class
* #param boolean Whether ot not to add on* attributes to list item
* #return string
*/
protected function _renderCategoryMenuItemHtml($category, $level = 0, $isLast = false, $isFirst = false,
$isOutermost = false, $outermostItemClass = '', $childrenWrapClass = '', $noEventAttributes = false)
{
if (!$category->getIsActive()) {
return '';
}
$html = array();
// get all children
if (Mage::helper('catalog/category_flat')->isEnabled()) {
$children = (array)$category->getChildrenNodes();
$childrenCount = count($children);
} else {
$children = $category->getChildren();
$childrenCount = $children->count();
}
$hasChildren = ($children && $childrenCount);
// select active children
$activeChildren = array();
foreach ($children as $child) {
if ($child->getIsActive()) {
$activeChildren[] = $child;
}
}
$activeChildrenCount = count($activeChildren);
$hasActiveChildren = ($activeChildrenCount > 0);
// prepare list item html classes
$classes = array();
$classes[] = 'level' . $level;
$classes[] = 'nav-' . $this->_getItemPosition($level);
if ($this->isCategoryActive($category)) {
$classes[] = 'active';
}
$linkClass = '';
if ($isOutermost && $outermostItemClass) {
$classes[] = $outermostItemClass;
$linkClass = ' class="'.$outermostItemClass.'"';
}
if ($isFirst) {
$classes[] = 'first';
}
if ($isLast) {
$classes[] = 'last';
}
if ($hasActiveChildren) {
$classes[] = 'parent';
}
// prepare list item attributes
$attributes = array();
if (count($classes) > 0) {
$attributes['class'] = implode(' ', $classes);
}
if ($hasActiveChildren && !$noEventAttributes) {
$attributes['onmouseover'] = 'toggleMenu(this,1)';
$attributes['onmouseout'] = 'toggleMenu(this,0)';
}
// assemble list item with attributes
$htmlLi = '<li';
foreach ($attributes as $attrName => $attrValue) {
$htmlLi .= ' ' . $attrName . '="' . str_replace('"', '\"', $attrValue) . '"';
}
$htmlLi .= '>';
$html[] = $htmlLi;
$html[] = '<a href="'.$this->getCategoryUrl($category).'"'.$linkClass.'>';
$html[] = '<span>' . $this->escapeHtml($category->getName()) . '</span>';
$html[] = '</a>';
if ( $level == 0 ) {
//get category description
$ca = Mage::getModel('catalog/category')->load($category->getId());
$description = $ca->getDescription();
if ( empty($description) || !Mage::getStoreConfig('celebritysettings/celebritysettings_navigation/show_description') ) {
$columns = 4;
} else {
$columns = 2;
}
$columnItemsNum = array_fill(0, $columns, floor($activeChildrenCount / $columns));
if ( $activeChildrenCount % $columns > 0 ) {
for ($i = 0; $i < ($activeChildrenCount % $columns); $i++ ) {
$columnItemsNum[$i]++;
}
}
$this->_columnHtml = array();
}
// render children
$htmlChildren = '';
$j = 0; //child index
$i = 0; //column index
$itemsCount = $columnItemsNum[$i];
foreach ($activeChildren as $child) {
if ( $level == 0 ) {
$isLast = (($j+1) == $itemsCount || $j == $activeChildrenCount - 1);
if ( $isLast ) {
$i++;
$itemsCount += $columnItemsNum[$i];
}
} else {
$isLast = ($j == $activeChildrenCount - 1);
}
$childHtml = $this->_renderCategoryMenuItemHtml(
$child,
($level + 1),
$isLast,
($j == 0),
false,
$outermostItemClass,
$childrenWrapClass,
$noEventAttributes
);
if ( $level == 0 ) {
$this->_columnHtml[] = $childHtml;
} else {
$htmlChildren .= $childHtml;
}
$j++;
}
if ( $level == 0 && $this->_columnHtml ) {
$i = 0;
foreach ( $columnItemsNum as $columnNum ) {
$chunk = array_slice($this->_columnHtml, $i, $columnNum);
$i += $columnNum;
$htmlChildren .= '<li '.(count($this->_columnHtml) == $i ? 'class="last"' : '').'><ol>';
foreach ( $chunk as $item ) {
$htmlChildren .= $item;
}
$htmlChildren .= '</ol></li>';
}
}
if ( !empty($description) && !empty($htmlChildren) && Mage::getStoreConfig('celebritysettings/celebritysettings_navigation/show_description') ) {
$htmlChildren .= '<li class="menu-category-description clearfix">'.$description;
if ( Mage::getStoreConfig('celebritysettings/celebritysettings_navigation/show_learn_more') ) {
$htmlChildren .= '<p><button class="button" onclick="window.location=\''.$this->getCategoryUrl($category).'\'"><span><span>'.$this->__('learn more').'</span></span></button></p>';
}
$htmlChildren .= '</li>';
}
if (!empty($htmlChildren)) {
if ($childrenWrapClass) {
$html[] = '<div class="' . $childrenWrapClass . '">';
}
$html[] = '<ul class="level' . $level . '">';
$html[] = $htmlChildren;
$html[] = '</ul>';
if ($childrenWrapClass) {
$html[] = '</div>';
}
}
$html[] = '</li>';
$html = implode("\n", $html);
return $html;
} }
I hope someone can see what to do in order to get the effect on the image :)
Best Regards,
Patrick

Answer 1

Well, Alan Storm is correct but for what it is worth, to answer your question 'which file do I edit', the file you edit is Navigation.php. I say this because top.phtml has the line echo $_menu;. Anyway, the code in protected function _renderCategoryMenuItemHtml() is perhaps a little convoluted and when I read the code and think about what you are trying to achieve I think you should either:
a) Try commenting out the lines:
if ($hasActiveChildren && !$noEventAttributes) {
$attributes['onmouseover'] = 'toggleMenu(this,1)';
$attributes['onmouseout'] = 'toggleMenu(this,0)';
}
in order to remove the mouseover interaction and then see if you can hack the CSS to get the layout you desire
or
b) Throw away all the code in protected function _renderCategoryMenuItemHtml() and start again: rewrite it to display the HTML structure you require using elements of the existing code.