WooCommerce images resize

This topic is very tricky. Mostly because in one way or another, a bulk automatic process of resizing images will distort an image in one way or another, and it’s quite hard to cover all scenarios from a single option. That’s because in most of the cases, users don’t take into account the image ratio’s. For example in general, images are different, one it’s taller either one is wider, or square etc.

That’s why it’s hard to cover all needs from a single option and usually users should take into consideration the uploaded image ratio. It’s best if images are edited and they follow the same rule. For example it’s great to have all images either wide, tall or square, not combined because this is where things go bad.

As for the theme, for example, in product categories – for the product images, you can resize them on the fly, by accessing Theme options > WooCommerce options > Categories page eg: http://hogash.d.pr/18vBT , however if you don’t want a fixed crop size, you can leave either width or height empty and they will not be cropped. An empty height field http://hogash.d.pr/JQU3 will make the images variable in height but always fixed on width. If it’s vice-versa, width is empty and height is defined, images will always have a specific height, but the width may vary.

Now for product pages – image sizes, you can access WooCommerce > Settings >Products > Display and here you can find the image sizes eg: http://hogash.d.pr/vjTb . Like above, it’s the same exact principle, you can disable hard crop and either width or height could be empty and it’ll automatically resize them. One different process of WooCommerce resize method though, is that you need to install this plugin https://wordpress.org/plugins/regenerate-thumbnails/ and regenerate thumbnails. Unlike the categories page where we’re resizing the images on the fly (internally by the theme), here is a bit of different and we didn’t wanted to take over this WooCommerce built-in functionality.