Catalog Images size on the shop page, are they correctly sized down?

[azura_eyes]

Hi,

I noticed that the Catalog Images size/resizing on the shop page are is not shown correctly.

The settings on standard Catalog Images are 150 x 150 px (which I have for the moment). So if I choose “Shop Page Display” and then “Show Subcategories” and the page from theme is used neighborhood/woocommerce/content-product_cat.php (I imagine)…

So the shop page should scale the Catalog Images to 150×150 and not to 450×450 what I think it does now.

I created in Photoshop a pic with the 150×150 px to show the wrong scaling. See my next private message with urls. Thanks!

[azura_eyes]

This reply has been marked as private.

[Kyle – SUPPORT]

Hi

The woocommerce sizes are based on the quality of the image, no matter what you put the images will still be resized as they are the dimensions needed for the category display. You will need to set a larger size that 150 x 150 for nice quality images

– Kyle

[azura_eyes]

But why? The sizes are set in Product Image Sizes/Catalog Images settings in the admin and should not be changed.

And if you see the generate code in the theme (below), the size is expected to be 150x150px but then someway on the way the theme resizes the images to 450x450px which is not correct.

Here is the code from firebug from the shop page “neighborhood/woocommerce/content-product_cat.php”
<img width="150" height="150" alt=”category” src=”http://the-site-url.com/wp-content/uploads/2014/09/150×150-category-image.png&#8221; />

You see that the img size is 150×150 px but still the output is stretched out… something is definitely wrong 🙁

Attachments:

You must be logged in to view attached files.

[Kyle – SUPPORT]

Let me explain:

Our theme design has categories to display at a certain width (270px). The image settings you chose are only for the quality of image. The CSS is in control of the actual width of the image on the page. If you wan’t your category images to be 150 x 150 then add this to your custom css:

.woocommerce ul.products li.product a img, .woocommerce-page ul.products li.product a img {
  width: 150px;
}

However as you can see it does not look good as it leaves a lot of space

– Kyle

[azura_eyes]

Ok, Kyle. So what is the optimal size for the category pics? The height and width? So it is shown as it was designed by you guys originally? Thanks!

[Kyle – SUPPORT]

Please see: http://support.swiftideas.net/knowledgebase/product-image-quality/

– Kyle

[Mar21]

Kyle,

could you precise the product image size, please?
There is no image in your link.

thanks

[Kyle – SUPPORT]

Please see: http://cardinal.swiftideas.com/documentation/wp-content/uploads/sites/35/2014/05/Screenshot-2014-06-27-04.04.38.png

– Kyle