Changing Product Image Background

[dakeweb]

Hello,

 

I am trying to change the color of the background of images on both product detail and product list pages.  I am using 1.6.0.9 default theme.  Images are cropped and a white background is shown. 

 

I edited the background of the image block in product.css as noted below:

 

/* .pb-left-column ***************************************************************************** */
.pb-left-column #image-block {
  position: relative;
  display: block;
  cursor: pointer;
  padding: 5px;
  border: 1px solid #dbdbdb;
  background: white; }
  @media (max-width: 767px) {
    .pb-left-column #image-block {
      width: 280px;
      margin: 0 auto; } }

 

Changing the bolded bacckground line gave me a slight border around the entire image with the desired color.  However the rest of the image block is white.  I am getting the impression this is not a background of product.css (and therefore not in product-list.css) but more a setting for what color is behind an image in general.  I could be wrong, though.

There is a topic here marked as solved:
http://www.prestashop.com/forums/topic/268875-solved-prestashop-image-cropping-background-change-white-color/

However, the ultimate "solution" is to use only one size image to prevent cropping.  This is not really a great solution, so I am hoping someone can help me specify a color in place of that white.  I could use a color matching the background and I will be good to go.  I am sure others will benefit from this as well.

Many thanks in advance for any help!

[dioniz]

That's not a background, so you can not manipulate it with css. That's image with white border. You need to set up image proportions to image settings in backoffice.

[joraColea]

SO how to solve this problem?

[rocky]

Go to the Preferences > Images tab in the Back Office. If your product images are all transparent PNGs, you can choose the "Use PNG for all images" option. Otherwise, you can choose the "Use PNG only if the base image is in PNG format" or "Use JPEG" options.

 

If you're using JPEGs, you can't have transparent backgrounds. You'll need to make all your product images the same aspect ratio and then change the image sizes with ticks in the "Products" column to match the aspect ratio of the uploaded images.