Step by Step guide to create a Sub Category Landing page in Magento

Step by Step guide to create a Sub Category Landing page in Magento

UPDATE: We now have a working version of the sub_navigation.phtml file for Magento Community edition:  1.7.2.0. You can jump straight to thecode by clicking here.

Here is a step by step guide to creating a sub-category landing page in Magento Community edition: 1.6.2.0. Some of the code was updated from posts elsewhere, but the key things that this does that I couldn’t find elsewhere are:

  • Uses the description of the sub-category on the landing page
  • Uses the image that is set for the sub-category on the landing page
  • If an image is not set for the sub-category, it uses an image for one of the products in the sub-category


The code that I have copied below has been styled for my customer, so you may need to adjust the style of the output to match your site, but here is how it looks for our customer:

KK-Sub-Category-landing-page-magento

  1. Create a file called sub_navigation.phtml
  2. Paste in the following code (please note this is the code for Magento Community 1.6.2.0 – for the new 1.7.2.0 code, please click here:

    1. Upload the sub_navigation.phtml file to this directory on your web server:
      /app/design/frontend/base/default/template/catalog/navigation
    2. Log into Magento Administration Panel and Click CMS > Static Blocks
    3. Click Add new Block
    4. Set block title; Sub Category Listing, Identifier; sub_category_listing, Status; Enabled and Content;
      {{block type="catalog/navigation" template="catalog/navigation/sub_navigation.phtml"}}
      edit-block
    5. Click Save block.
    6. Click Catalogue > Manage Categories
    7. Click on a Category (make sure it is a category with sub categories)
    8. Click on the Display Settings tab
    9. Change Display Mode; Static block only, CMS Block; Sub Category Listing, Is Anchor; Yes
      catalogue-category

  1. Click Save Category
  2. Now when you navigate to that category in your magento site, you will see the sub category landing page.
  3. You can repeat steps 8 to 12 for as many of your categories as you wish.

Magento Community 1.7.2.0 sub_navigation.phtml file

Thanks to the community, we now have a working version for 1.7.2.0.