Magento move layered navigation block between the toolbar and product list

By | July 8, 2016

Magento move layered navigation block between the toolbar and product list

In this tutorial we are going to see how we can move layered navigation block between the toolbar and product list in the product list page of Magento. By default the layered navigation block appears in the left side bar.

You can use the following piece of code, if you want to move the layered navigation to the content block,

This will move the layered navigation block from left side to the content block. But it will only appear at the top/bottom of the page. Because, We’ve added the block to the block content which only has two direct child blocks: category.products and product.tooltip. So lets see how we can move layered navigation between the toolbar and product list exactly. To do this we have to add the following code to the layout XML

This will move the layered navigation block from the left column to the content column without re-creating classes and the like. You can see I inserted the block as a child of the block product_list.

If you call the page now you will see that the layered navigation isn’t displayed at all. That’s because opposed to the content block, the product_list block doesn’t output all child blocks by default. You have to echo the block yourself in the template file.

To do this copy list.phtml (app/design/frontend/base/default/template/catalog/product/list.phtml) file from base theme to your theme. Open the file and find $this->getToolbarHtml(). Place the following code after the line.

Magento move layered navigation block between the toolbar and product list

Magento move layered navigation block between the toolbar and product list

After adding the line, if you refresh the page you will see the layered navigation block between the toolbar and product list. Do clear the cache and check if you can not see the block after reloading the page.

Magento move layered navigation block between the toolbar and product list

Magento move layered navigation block between the toolbar and product list

Leave a Reply