How to add layered navigation on Any Cms page (or Home Page).

In this post we’re going to explain layered navigation in Content section and/or Any Cms page (or Home Page).  Most of developer and client’s needs layered navigation in Content section.

To add Magento’s layered navigation to a CMS page where you’re showing items simply edit your CMS page in the admin – under the “Design” tab put this code:

Here is how:

Open CMS->Pages->[your page]  in Magento Admin Panel.

Add the following layout instructions to Design tab->Page Layout->Layout Update XML:

 

<update handle="cms_page_layered" />
<!-- add category products to content column -->
<reference name="cms.products">
    <block type="catalog/product_list" name="product_list" 
      template="catalog/product/list.phtml">
      <action method="setCategoryId"><category_id>3</category_id></action>
      <block type="catalog/product_list_toolbar" name="product_list_toolbar" 
          template="catalog/product/list/toolbar.phtml">
        <block type="page/html_pager" name="product_list_toolbar_pager"/>
      </block>
      <action method="addColumnCountLayoutDepend">
          <layout>empty</layout>
          <count>6</count>
      </action>
      <action method="addColumnCountLayoutDepend">
          <layout>one_column</layout>
          <count>5</count>
      </action>
      <action method="addColumnCountLayoutDepend">
          <layout>two_columns_left</layout>
          <count>4</count>
      </action>
      <action method="addColumnCountLayoutDepend">
          <layout>two_columns_right</layout>
          <count>4</count>
      </action>
      <action method="addColumnCountLayoutDepend">
          <layout>three_columns</layout>
          <count>3</count>
      </action>
      <action method="setToolbarBlockName"><name>product_list_toolbar</name></action>
    </block>
</reference>
<reference name="before_body_end">
    <block type="mana_filters/layer" name="mana_layer" as="mana_layer" before="-">
        <action method="setCategoryId"><category_id>3</category_id></action>
    </block>
</reference>

 

3. Also insert ID of desired category  in <category_id>3</category_id> (2 times).

4. Open desired category of your store through Catalog->Manage Categories. Make sure that Is Anchor=Yes on Display Settings tab.

 

2 thoughts on “How to add layered navigation on Any Cms page (or Home Page).

  1. Quality posts is the secret to attract the people to pay a
    quick visit the site, that’s what this site is providing.

Leave a Reply

Your email address will not be published.