Magento resize different size images to unique size. Read description.

Question

I am having a catalog with different sized images. Some will be 200x300 some will be 300x150. But All i want to do is to resize all the image to one size which makes me to show in my home page listing.

I am trying the normal magento resize to crop tp 160x210 as follows,

   <img src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->constrainOnly(false)->keepAspectRatio(true)->keepFrame(false)->resize(160, 210); ?>" alt="<?php echo $this->htmlEscape($this->getImageLabel($_product, 'small_image')) ?>" />

But its cropping images in different size, The images are in random height and widths 160x135, 160x156, 159x210, 150x210

Detailed answers are highly appreciated.

Answer 1

Either set keepFrame to true, so it's always exact 160x210, or set keepAspectRatio to false.

Now it is making sure both width and height won't exceed the values you feed it. But since you don't want a frame, and want to keep your aspect ratio, it has to change both width and height in the same ratio.

<?php 
echo $this->helper('catalog/image')->init($_product, 'small_image')
    ->constrainOnly(false)
    ->keepAspectRatio(true)
    ->keepFrame(true)
    ->resize(160, 210);
?>

Edit: For cropping you need to use Varien_Image. Unfortunately the Mage_Catalog_Helper_Image doesn't offer a method to return the Varien_Image class. So you need to make a custom module to make it possible to crop.

See https://stackoverflow.com/questions/9492770/magento-crop-image for an example.

Basically it says you need to make your own helper and extend Mage_Catalog_Helper_Image, so you can use $this->_getModel()->getImageProcessor()->crop()

Answer 2

For resizing image, use the below code : // image size will be 200x200

<img src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->keepFrame(false)->resize(200); ?>" />

// image size 200x220;

<img src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->keepFrame(false)->resize(200, 220); ?>" />

// sometimes the image size alters after using resize() function and it shows a white space at both the sides on left and right, so you can also adjust the width and height using this code:

<img src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->keepFrame(false)->resize(); ?>"  width="200" height="220"/>