Chris Haugen
Chris Haugen

Reputation: 817

On woocommerce how do I remove this cropping to product catergory thumbnails?

I've searched and tried fixing this myself for several hours, however, I cannot find a proper solution.

The images I upload to Woocommerce's product category are getting cropped to a 1:1 aspect ratio, and I want them to stay at the original dimensions and aspect ratio that I uploaded them at.

the main part of the snippet I am confused with is that there is an added -150x150.png at the end of my img src. How in the world do I remove that? I could not find it anywhere in any of the woocommerce php files. I'm assuming this is being added when the thumbnail is uploaded?

The code that the php creates to display the image looks like this:

<a href="http://localhost/radioactivewonderland/?product_cat=phone-charms">

    <img src="http://localhost/radioactivewonderland/wp-content/uploads/2015/02/cghjnfgchjn-150x150.png" alt="Phone Charms" height="" width="Phone Charms" />      




    <h3> Phone Charms <mark class="count">(1)</mark>        </h3>


</a>

Upvotes: 8

Views: 31864

Answers (2)

Rahul Shinde
Rahul Shinde

Reputation: 1662

Firstly, go to Theme Options> Shop settings, and set Enable Product Image Crop on Catalog pages to OFF.

Then navigate to Appearance> customize> WooCommerce> Product images, and set Thumbnail cropping to uncropped.

Save the settings, and view your shop page out of the customizer. Your full images should display.

Let me know if that works for you.

Upvotes: -1

helgatheviking
helgatheviking

Reputation: 26319

Update for WooCommerce 3.4

The thumbnail sizes are now available in the Customizer. You'll need to open the Customizer, then select WooCommerce, then Product Images.

Customizer>WooCommerce>Product Images

The "main image" is the single product image. And the "thumbnail" is the shop/archive loop image.

The settings are no longer available in the admin Settings.


The category images are the same size as shop_image (or Catalog) thumbnail. WooCommerce handles its product thumbnails in its settings:

WooCommerce->Settings>Products>Display

You can change its height, width, and toggle the hard crop on/off.

WooCommerce product image settings

After changing the image sizes you will need to regenerate thumbnails.

Upvotes: 15

Related Questions