How to resize Magento e-Commerce category images

So, far I know Magento e-Commerce has no support for image resize other than those for product images. But no need to fear as we can use same image resizing object and customise it to suit our need.

Just follow the following post and you will have image resizer in fraction of time you will spend on researching and writing your own as i had.

Create Folder named "Technooze/Timage" under app/code/community

Now on Under Technooze create 3 more folders Block, etc and Helper.

Under etc folder on config.xml file add below code:

<?xml version="1.0"?>
<!-- 
/**
* @category   Technooze/Modules/magento-how-tos
* @package    Technooze_Timage
* @author     Damodar Bashyal
* @license    http://opensource.org/licenses/osl-3.0.php  Open Software License (OSL 3.0)
*/
-->
<config>
    <modules>
        <Technooze_Timage>
            <version>0.1.0</version>
        </Technooze_Timage>
    </modules>
    <frontend>
        <routers>
            <timage>
                <use>standard</use>
                <args>
                    <module>Technooze_Timage</module>
                    <frontName>timage</frontName>
                </args>
            </timage>
        </routers>
        <layout>
            <updates>
                <timage>
                    <file>timage.xml</file>
                </timage>
            </updates>
        </layout>
    </frontend>
    <global>
        <helpers>
            <timage>
                <class>Technooze_Timage_Helper</class>
            </timage>
        </helpers>
        <blocks>
            <timage>
                <class>Technooze_Timage_Block</class>
            </timage>
        </blocks>
    </global>
</config>

Now under Block add below code on file Data.php

<?php
/**
* @category   Technooze/Modules/magento-how-tos
* @package    Technooze_Timage
* @author     Damodar Bashyal
* @license    http://opensource.org/licenses/osl-3.0.php  Open Software License (OSL 3.0)
*/
class Technooze_Timage_Block_Data extends Mage_Core_Block_Template
{
}

Next, under Helper Folder add below code on Data.php

<?php
/**
* @category   Technooze/Modules/magento-how-tos
* @package    Technooze_Timage
* @author     Damodar Bashyal
* @license    http://opensource.org/licenses/osl-3.0.php  Open Software License (OSL 3.0)
*/
class Technooze_Timage_Helper_Data extends Mage_Core_Helper_Abstract
{
    var
        $width = null,
        $height = null,
        $rawImg = '',
        $img = false,
        $cacheDir = '',
        $cachedImage = '',
        $cachedImageUrl = '',
        $ext = '',
        $bgColor = array(255, 255, 255),
        $imageObj = '',
        $baseUrl = '',
        $placeHolder = false;
    
    public function init($img=false)
    {
        if($img)
        {
            $this->rawImg = $img;
        }
        
        if(empty($this->placeHolder))
        {
            $this->placeHolder = Mage::getDesign()->getSkinUrl() . 'images/catalog/product/placeholder/image.jpg';
        }
        $this->imagePath($this->rawImg);
        
        $this->imageObj = new Varien_Image($this->img);
        
        $path_parts = pathinfo($this->img);
        
        $this->ext = $path_parts['extension'];
        
        $this->cacheDir();
        
        return $this;
    }

    public function resize($width=false, $height=false)
    {
        if($width)
        {
            $this->width = $width;
        }

        if($height)
        {
            $this->height = $height;
        }
        
        $this->cacheIt();
        
        return $this->cachedImageUrl();
    }
    
    public function cachedImageUrl()
    {
        $img = str_replace(BP, '', $this->cachedImage);
        $img = trim(str_replace('\\', '/', $img), '/');
        
        return $this->baseUrl . $img;
    }

    public function cacheIt()
    {
        $this->cachedImage = $this->cacheDir . md5($this->img . $this->width . $this->height) . '.' .$this->ext;
        
        if(file_exists($this->cachedImage))
        {
            return $this->cachedImage;
        }
        
        $this->resizer();
    }

    public function resizer()
    {
        try{
            $this->imageObj->constrainOnly(true);
            $this->imageObj->keepAspectRatio(true);
            $this->imageObj->keepFrame(true);
            $this->imageObj->keepTransparency(true);
            $this->imageObj->backgroundColor($this->bgColor);
            $this->imageObj->resize($this->width, $this->height);
            $this->imageObj->save($this->cachedImage);
        } catch(Exception $e){
            return $e->getMessage();
        }
    }

    public function imagePath($img='')
    {
        $this->baseUrl = str_replace('index.php/', '', Mage::getBaseUrl());
        $img = str_replace($this->baseUrl, '', $img);
        $img = trim(str_replace('/', DS, $img), DS);
        
        $this->img = BP . DS . $img;
        
        if((!file_exists($this->img) || !is_file($this->img)) && !empty($this->placeHolder))
        {
            $this->imagePath($this->placeHolder);
            $this->placeHolder = false;
        }
    }

    public function cacheDir()
    {
        $cache = BP . DS . 'media' . DS . 'catalog' . DS . 'cache' . DS;
        
        if(!is_dir($cache))
        {
            mkdir($cache);
        }
        $this->cacheDir = $cache;
    }
}

Finally, under app/etc/modules add below code on Technooze_Timage.xml

<?xml version="1.0"?>
<!-- 
/**
* @category   Technooze/Modules/magento-how-tos
* @package    Technooze_Timage
* @author     Damodar Bashyal
* @license    http://opensource.org/licenses/osl-3.0.php  Open Software License (OSL 3.0)
*/
-->
<config>
    <modules>
        <Technooze_Timage>
            <active>true</active>
            <codePool>community</codePool>
        </Technooze_Timage>
    </modules>
</config>

How to Use this module?

It's quite easy actually :) Where you display image just pass through to resize before you display it. e.g.

/*
 * You can pass width and height and much more, see helper for details.
 * echo $this->helper('timage')->init($_category->getImageUrl())->resize(null, 120)
 * echo $this->helper('timage')->init($_category->getImageUrl())->resize(120, null)
 * echo $this->helper('timage')->init($_category->getImageUrl())->resize(120, 120)
 */
<div class="product-image">
    <a href="<?php echo $_category->getURL() ?>" title="<?php echo $this->htmlEscape($_category->getName()) ?>">
        <img src="<?php echo $this->helper('timage')->init($_category->getImageUrl())->resize(null, 120) ?>" alt="<?php echo $this->htmlEscape($_category->getName()) ?>"/>
    </a>
</div>

Download Full Source Code