3

I am trying to display my top navigation like this:

 _________________ | Main Category | |_______________| | (on hover) | _________________________________________________ | | | |--> | Category 1.1 Category 1.2 Category 1.3 | | _____________ _____________ _____________ | | Subcat. 1.1.1 Subcat. 1.2.1 Subcat. 1.3.1 | | Subcat. 1.1.2 Subcat. 1.2.2 Subcat. 1.3.2 | | Subcat. 1.1.3 Subcat. 1.2.3 Subcat. 1.3.3 | |_______________________________________________|

So my goal is to list the subcategories below the parent category, directly in the ul.level0 dropdown, instead of having them inside of another ul (ul.level1).

I know there are several extensions that would allow me to do this, but it seems they all offer too much functionality and therefore have a huge impact on store performance while I could probably achieve the same result with a simple template change adding no extra page load.

Improve this question

1 Answer 1

Reset to default
2

Magento 1.8.0.2 and above

You can change this directly in app/design/frontend/yourtheme/default/template/page/html/topmenu/renderer.html

For your reference, this is defined in page.xml:

<block type="page/html_topmenu" name="catalog.topnav" template="page/html/topmenu.phtml"> <block type="page/html_topmenu_renderer" name="catalog.topnav.renderer" template="page/html/topmenu/renderer.phtml"/> </block>

Then you can just these two lines:

if($childLevel <= 0) $html .= '<ul class="level'. $childLevel .'">'; ... if($childLevel <= 0) $html .= '</ul>';

For older versions of Magento

The HTML for the top navigation is located in: app/code/core/Mage/Page/Block/Html/Topmenu.php so you will need to rewrite this block in a custom module

 <config> ... <blocks> <page><rewrite><html_topmenu>Namespace_Module_Block_Html_Topmenu</html_topmenu></rewrite></page> </blocks> ... </config>

Then you just need to override the _getHtml function - you will notice when it populates the children dropdown, it adds <ul> tags. You can do the following:

 if($childLevel <= 0) $html[] = '<ul class="level' . $childLevel. '">'; $html[] = $this->_getHtml($child, $childrenWrapClass); if($childLevel <= 0) $html[] = '</ul>';
Improve this answer
5
  • 2
    I only checked in Enterprise 1.12 and Community 1.9.1, but the top menu block in the header is actually in Mage_Page__Block_Html_Top_Menu. Commented May 11, 2015 at 13:22
  • I think you are right, the file to change is Mage\Page\Block\Html\Topmenu.php. I will give this shot and share my results. Thanks! Commented May 11, 2015 at 13:24
  • My bad, the Catalog_Navigation block would be for the left category navigation. I have updated my response with the correct paths ;) Commented May 11, 2015 at 13:30
  • 1
    I have just checked, since 1.8.0.2, you can directly modify the template in template/page/html/topmenu/renderer.phtml so you don't have to create a module. Although, if you run an older version, you will need this override (I will update my ticket accordingly) Commented May 11, 2015 at 14:41
  • I am trying to achieve similar layout of the top navigation -> sub navigation however not getting the right result. if($childLevel <= 0) $html .= '<ul class="level'. $childLevel .'">'; ... if($childLevel <= 0) $html .= '</ul>'; any detail explanation to get the desired layout? @Mayers Commented Mar 8, 2018 at 11:25

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.