Removing white image background in magento

If you are using  different detentions for your product-list images, you may face this problem:

In order to remove the white borders,

1. On your FTP, using  the File manager from your hosting  Cpanel  or  an FTP client (FileZilla, CuteFTP etc), go to the app/design/frontend/your_theme/template/catalog/product/ folder folder (where your_theme  is the unique name of your theme) .


2. Open the list.phtml file to edit.


3. Search for the following code (about  line 94):

<div> <a href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>"><img src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->resize(203); ?>" width="203" height="203" alt="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>" /></a>

1. Change the values of; resize(210), width=”210″, height=”210″ to the values of your image (the values themselves may differ depending on your template number). Thus, if you image is 210×164 it should look like below:

<div> <a href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>"><img src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->resize(210); ?>" width="164" height="210" alt="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>" /></a>

1. Add the following to the same code

constrainOnly(TRUE)->keepAspectRatio(TRUE)->keepFrame(FALSE)->

so the final result looks like this:

<div> <a href="<?php echo $_product->getProductUrl() ?>" title="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>"><img src="<?php echo $this->helper('catalog/image')->init($_product, 'small_image')->constrainOnly(TRUE)->keepAspectRatio(TRUE)->keepFrame(FALSE)->resize(210); ?>" width="164" height="210" alt="<?php echo $this->stripTags($this->getImageLabel($_product, 'small_image'), null, true) ?>" /></a>

1. Save the changes to the file, log into your Magento admin panel , the Catalog -> Manage products  menu and  re-upload the image.


2. Clear your Magento/browser cache and check the category page. The image should now have no white borders.

Removing white image background in magento