This tutorial for creating a grid for categories with images.

You can do it without editing the core files of Magento

*Create a new file called “category_listing.phtml” on this directory “app/design/frontend/default/YOUR_TEMPLATE/catalog/navigation/”.

*Add the following code on that file:

<?php $_maincategorylisting=$this->getCurrentCategory();?>
<?php $_categories=$this->getCurrentChildCategories();?>
<div class="widget widget-viewed">
    <div class="widget-products">
        <?php $_columnCount = $this->getColumnCount(); ?>
        <?php $i=0; foreach ($_categories as $_category): ?>
        <?php if($_category->getIsActive()): ?>
        <?php $cur_category=Mage::getModel('catalog/category')->load($_category->getId()); ?>
        <?php $layer = Mage::getSingleton('catalog/layer'); ?>
        <?php $layer->setCurrentCategory($cur_category); ?>
        <?php if($_imageUrl=$this->getCurrentCategory()->getImageUrl()):?>
        <?php if ($i++%$_columnCount==0): ?>
            <ul class="products-grid">
        <?php endif; ?>
                <li class="item<?php if(($i-1)%$_columnCount==0): ?> first<?php elseif($i%$_columnCount==0): ?> last<?php endif; ?>">
                 <a href="<?php echo $this->getCategoryUrl($_category); ?>" title="<?php echo $this->htmlEscape($_category->getName()); ?>"> <img src="<?php echo $_imageUrl; ?>" width="135px" height="135px" alt="<?php echo $this->htmlEscape($_category->getName()); ?>" /> </a>
                <h3><?php echo $this->htmlEscape($_category->getName()); ?></h3>
                <?php if($_description=$this->getCurrentCategory()->getDescription()):?>
                <p class="category-description"> <?php echo $_description; ?></p>
                <?php endif; ?>
                </li>
        <?php if ($i%$_columnCount==0 || $i==count($_products)): ?>
            </ul>
        <?php endif; ?>
<?php endif; ?>
<?php endif; ?>
        <?php endforeach; ?>
    </div>
</div>

*Go to the Magento admin panel CMS -> Pages -> Add New Page.

Page Title: Categories

URL Key: categories

Status: enabled

Content:

{{block type="catalog/navigation" column_count="3" name="catalog.categories" template="catalog/navigation/category_listing.phtml"}}

*Click on Save Page.

*You can access that page from here:
http://www.domain.com/categories
——————–
I have tested it on Magento 1.4.1.0 and it works GREAT

Pin It on Pinterest

Share This