Magento – How to show few categories with image and description on home page

category

i want to show root categories with image and description on home page content area.
Basically i want show them as slides, each category scrolling with its image and description.

Please suggest

Best Answer

You need to create your own block, or at least one template.
Here is the short version using only a template.
Create the file app/design/frontend/base/default/template/homepage/categories.phtml with this content:

<?php
$rootId = Mage::app()->getStore()->getRootCategoryId();
$categories = Mage::getModel('catalog/category')->getCollection()
    ->addAttributeToSelect('*')
    ->addAttributeToFilter('parent_id', $rootId)
    ->setOrder('position')
    ->addAttributeToFilter('include_in_menu', 1) //this is needed if you want only the categories in the menu
    ->addAttributeToFilter('is_active', 1);

$_helper = $this->helper('catalog/output'); 
?>
<?php if ($categories->count() > 0) : ?>
<ul>
    <?php foreach ($categories as $category) : ?>
       <li>
           <div class="name">
              <a href="<?php echo $category->getUrl()?>" title="<?php echo $this->escapeHtml($category->getName())?>"><?php echo $category->getName()?></a>
           </div>
           <div class="image">
               <?php if ($category->getImageUrl()) :?>
                   <img src="<?php echo $category->getImageUrl()?>" alt="<?php echo $this->escapeHtml($category->getName())?>" />
               <?php endif;?>
           </div>
           <div class="description">
               <?php echo $_helper->categoryAttribute($category, $category->getDescription(), 'description') ?>
           </div>
       </li>
    <?php endforeach;?>
</ul>
<?php endif;?>

Now you need to add this to the homepage content: 

{{block type="core/template" template="homepage/categories.phtml"}}

The markup of the template may need some modifications in order to make it a slider, but all the elements you need are there.

There is a cleaner method where you create you own block and move the code that retrieves the categories to a block method and call that method in the template. But the idea is the same.

I haven't tested the code so be careful at syntax errors.

Related Topic