RSS

Remove white image space upon resizing thumbnails in Magento

21 Dec

Magento has pretty neat image helper you can use to output your product images

Here is a better, more nicer solution to ditch the whit frame space around resized thumbnail images in Magento.

Here is a practical example of a code sample from default media.phtml file:
<?php foreach ($this->getGalleryImages() as $_image): ?>
<li>
<a href=”#” onclick=”popWin(‘<?php echo $this->getGalleryUrl($_image) ?>’, ‘gallery’, ‘width=300,height=300,left=0,top=0,location=no,status=yes,scrollbars=yes,resizable=yes’); return false;” title=”< ?php echo $this->htmlEscape($_image->getLabel()) ?>”><img src=”<?php echo $this-/>helper(‘catalog/image’)->init($this->getProduct(), ‘thumbnail’, $_image->getFile())->resize(56); ?>” width=”56″ height=”56″ alt=”< ?php echo $this->htmlEscape($_image->getLabel()) ?>” /></a>
</li>
< ?php endforeach; ?>

Change it by the following :


< ?php foreach ($this->getGalleryImages() as $_image): ?>
<li>
<a href=”#” onclick=”popWin(‘<?php echo $this->getGalleryUrl($_image) ?>’, ‘gallery’, ‘width=300,height=300,left=0,top=0,location=no,status=yes,scrollbars=yes,resizable=yes’); return false;” title=”< ?php echo $this->htmlEscape($_image->getLabel()) ?>”><img src=”<?php echo $this-/>helper(‘catalog/image’)->init($this->getProduct(), ‘thumbnail’, $_image->getFile())->keepFrame(false)->resize(56); ?>” alt=”< ?php echo $this->htmlEscape($_image->getLabel()) ?>” /></a>
</li>
< ?php endforeach; ?>

As you can see, all it took was to add the keepFrame(false) method call prior to calling the resize()method.

 

 

 

 
Leave a comment

Posted by on Dec 21, 2011 in Magento

 

Tags: , ,

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

 
%d bloggers like this: