Magento – Show Category Thumb Image on startpage

categoryce-1.7.0.2cmsimage

How can I show the thumb image from a category on the shops home page?

I added a getThumbnailUrl function in app\code\local\Mage\Catalog\Model\category.php but I don't know how to call it with CMS Directives.

I would like to display some categories as a grid. As a work-a-round I hard coded the link to the thumb but that will be broken if a new thumb is uploaded:

    <li class="span4">
        <a class="banner banner1" href="{{store url='new.html'}}">
            <img src="{{media url='catalog/category/new-thumb.jpg'}}" alt="New Stuff"  />
        </a>
    </li>

Best Answer

There is no (easy) way to do this dynamically from the CMS page content editor. I'm afraid this will require some custom code.

Best course of action would be to create a new extensions, let's call it Acme_Categorygrid for this example. For more info about creating extensions please view this comment by chapagain

In your etc/config.xml file add the following code

<config>
    [...]
    <global>
            [...]
        <blocks>
            <categorygrid>
                <class>Acme_Categorygrid_Block</class>
            </categorygrid>
        </blocks>
            [...]
    </global>
    [...]
</config>

Then create a new Block class with the following code

class Acme_Categorygrid_Block_Grid extends Mage_Core_Block_Template
{

    public function categories()
    {
        $parent_id = 1;

        $children = Mage::getModel('catalog/category')->getCategories($parent_id);

        return $children;
    }
}

Now all we need is a template file

<?php

$categories = $this->categories();

?>
<ul class="category-grid">
<?php foreach ($categories as $category): ?>
    <li>
        <a href="<?php echo $category->getUrl();?>">
            <img src="<?php echo $category->getThumbnail();?>" alt="<?php echo $category->getName();?>"/>
        </a>
    </li>
<?php endforeach; ?>
</ul>

Now you can add in the content of the CMS page a block tag: {{block type='categorygrid/grid' template='categorygrid/grid.phtml'}}

This should now display the just created block. Mind you, I haven't tested the code so it might need some tweaking, especially in the template file but hopefully this'll help you a long way.