Magento vertical category menu with Four level subcategory nav in left side

Magento vertical category menu with the code adapted from this thread. It’s quite easy to implement and to make it even easier for others.

* Add a new block type in “catalog.xml” file
* Create a new phtml file and name it “leftnav.phtml”, place it inside catalog/navigation
* Edit CSS

Add a new block type in “catalog.xml” file

Here we presume you want to have the vertical category menu shows up on every page, to do so, we will place the code in the layout like so, and we want it to always stay on the top, so we added “before=”-“:

You can change the reference name from ‘right’ to left if you prefer to have the vertical menu placed on the left column.

Create a leftnav.phtml file

Edit your CSS

That’s it! Simple isn’t it?

Known issue in Magento version 1.3

The recent release of Magento v1.3 has introduced Flat Catalog Category and Flat Catalog Product features, and some codes had changed in code/core/Mage/Catalog/Naviation.php that resulting Peter’s code not compatible with v1.3, as such, you need to update:


If you wish to switch on Flat Catalog Category; however, we found a bug related to custom options when add to cart is performed with Flat Catalog Category switched on. The bug has been assigned, and before Varien releases an update, your choice is to use the old code with “getChildren” with no Flat Catalog Category enables if you have Configurable products or Simple Products with Custom Options setup.

The above leftnav code is for Flat Catalog Category switch on. Simply revert “getChildrenCategories()” to “getChildren()” if you do not want to use Flat Catalog Category feature.

Source :

Leave a Reply

Your email address will not be published. Required fields are marked *