There are countless WooCommerce image size plugins for you to choose from, but how do you pick the right one for your shop?
My team and I are managing a number of WooCommerce sites for our WordPress maintenance clients with plenty of products.
Hence, we thought it might be a good idea to compile our experiences with plugins that can change WooCommerce product image sizes in a post. This post is the result. 🤔
In it, we give you some background on why managing the sizes of your product images is important and which plugins we prefer for this task.
Do we need WooCommerce image size plugins?
Let's start with 🧐 explaining why it makes sense to manage your WooCommerce image sizes.
With installing WooCommerce on your site, the plugin adds three new default images sizes to your media library. Each of these sizes reflects a certain usage:
woocommerce_thumbnail – used in the product ‘grids’ in places such as the shop page.
woocommerce_single – used on single product pages.
woocommerce_gallery_thumbnail – used below the main image on the single product page to switch the gallery.
You'll want to ensure that those size presets fit your design, so that your images look great and are loaded in exactly the correct size.
Images that are too small will look blurry and hurt conversions badly. Product images that are too big will get scaled down and prevent your website from loading fast.
Check out our 🚀 guide on getting a 1-second loading time here.
You can see which sizes WooCommerce defines in these settings when you go to in the WooCommerce settings in your Customizer:
Taken from the official WooCommerce documentation is this explanation:
If the theme is declaring image sizes, the top section will be hidden and only the cropping option will be visible.
Changing the cropping option, or
widths,will update the preview on the right side to show how things will look. Changes will not be visible to customers until the customizer is ‘published’ and the thumbnails have been regenerated to the new dimensions.
The thumbnail cropping section in the customizer allows store owners to select one of three cropping ratio settings for images in the catalog:
- 1:1 (Square
- Custom (Store owner can enter a custom aspect ratio)
- Uncropped (Preserve single image aspect ratio)
Actual image dimensions are then calculated based on the cropping option selected, and the image width.Source: https://docs.woocommerce.com/document/image-sizes-theme-developers/
As you can tell, managing product images without WooCommerce image size plugins isn't exactly intuitive. Unfortunately, that doesn't make it less important.
You might even find when looking into the Customizer settings on your own page, that the two above fields for entering pixel values aren't showing.
That is due to your theme setting these image sizes in the theme code. If you're proficient in writing PHP code for WordPress, this article will explain how you can handle your product thumbnail sizes without any plugin.
If you're not a WordPress developer, your best ✔️ bet is a WooCommerce image size plugin. The only thing better than that would be to sign up for one of our maintenance plans and have us configure the perfect settings.
Our favorite WooCommerce image size plugins
Hence, over time we managed to use a number of plugins to simplify controlling WooCommerce image sizes. And we're going to share our two favorites with you so that you can save the hours we put in testing.
For us, one feature was most important in assessing which WooCommerce image size plugins we like and which ones we dislike:
- It must be intuitive to change image sizes, being clear which image size is currently edited and where it's used.
So far, so straightforward.
And if your theme does not set WooCommerce image thumbnail sizes in its code, managing product image sizes continues to be straightforward. You can simply use the Customizer as shown in the screenshot ⬆️ above.
The only thing you need is a plugin called Regenerate Thumbnails. That plugin creates the new product thumbnails after you changed the size settings.
However, if your Customizer is not showing the pixel values for the WooCommerce product images, you'll need a different plugin.
In that case, we came across the WooThumbs plugin by IconicWP. It's a paid plugin, but so worth the minimal investment. Even if it saves you just one hour of fiddling around, it will pay for itself.
With WooThumbs, you can:
- edit WooCommerce image sizes easily,
- implement various product image sliders (e.g. on the product detail page),
- create stunning zoom effects,
- and much more
I'm not going to outline all features included in WooThumb, head over to their site if you want to learn more (click the image ⬇️ below).
With that being said, managing WooCommerce can still be a daunting task. If you ever need help with your shop or want to ensure it's running fast and stable, we've got your back👌.