Latest Blog - Magento
Today, we will learn how to display custom category listing block in Magento 1.9. In the end of this tutorial you will be able to create a custom category list and display it in the left panel of your Magento theme.
Create Category.phtml File To Show The Category Listing.
Go to the template/catalog/navigation and create a (.phmtl) file. I have made the process simple for your understanding and created the file with name ‘category.phtml’. You can create a file with your own name. For this tutorial, we will be using ‘category.phtml’ as the file name.
Write the following code in category.phtml:
Today, we will learn how to display custom category listing block in Magento 1.9. In the end of this tutorial you will be able to create a custom category list and display it in the left panel of your Magento theme.
Create Category.phtml File To Show The Category Listing.
Go to the template/catalog/navigation and create a (.phmtl) file. I have made the process simple for your understanding and created the file with name ‘category.phtml’. You can create a file with your own name. For this tutorial, we will be using ‘category.phtml’ as the file name.
Write the following code in category.phtml:
<?php // get first level categroy children $cat = Mage::getModel('catalog/category')->load(2)->getChildren(); $catIds = explode(',',$cats); ?> <ul> <?php foreach($catIds as $catID): ?> <li> <?php $category = Mage::getModel('catalog/category')->load($catID); //display category name echo $category->getName(); //get subcategory $subcats = Mage::getModel('catalog/category')->load($category->getId())->getChildren(); $subcatIds = explode(',',$subcats); ?> // only display if sub-category exist <?php if(count($subcatIds)>= 1 ): ?> <ul> <?php foreach($subcatIds as $subcatId): ?> <li> <?php $subCategory = Mage::getModel('catalog/category')->load($subcatId); //display sub-category name echo $subCategory->getName(); ?> </li> <?php endforeach ?> </ul> <?php endif ?> </li> <?php endforeach ?> </ul>
The above code will list the category and subcategory of the catalog if it exists.
Now, we have to call this code somewhere to display it.
Navigate to the layout of your theme. Find the ‘catalog.xml’ file and edit it. Look for the option “Default layout, loads most of the pages”. This acts as a global scope and it is usually displayed in most of the pages.
Find the block <reference name=”left”> [Note: You can add this to any location you want. For this tutorial, we will display it in the left panel. So, just before the block ends </reference> add the following code:
<block type=”catalog/navigation” after=”cart_sidebar” name=”catalog_category” template=”catalog/navigation/category.phtml”/>
Tadaa! you are done. You have created the custom category listing block which will be displayed on the left panel. For any queries feel free to comment below.
The above code will list the category and subcategory of the catalog if it exists.
Now, we have to call this code somewhere to display it.
Navigate to the layout of your theme. Find the ‘catalog.xml’ file and edit it. Look for the option “Default layout, loads most of the pages”. This acts as a global scope and it is usually displayed in most of the pages.
Find the block <reference name=”left”> [Note: You can add this to any location you want. For this tutorial, we will display it in the left panel. So, just before the block ends </reference> add the following code:
<block type=”catalog/navigation” after=”cart_sidebar” name=”catalog_category” template=”catalog/navigation/category.phtml”/>
Tadaa! you are done. You have created the custom category listing block which will be displayed on the left panel. For any queries feel free to comment below.
Design
Art
AI
Development
Apps