How to Optimize WooCommerce Product Images

Hosting Mautic QuickStart -50% with support in Spanish
24 hours and free training

Send up to 1,000,000 emails/year. Mautic Support in Spanish 24 hours, 365 days

I have to admit, I am more visual than visceral, and especially when it comes to buying products, clothing, footwear and other accessories, and that means that I don’t necessarily buy based on what the price tag tells me, but rather based on what the price tag tells me. visually convey the product.

Let’s talk about how to optimize WooCommerce product images so that they look and sell better.

The image of a product influences more than 50% of our purchase intention and you know!

If you have an Internet store, made with WooCommerce, you will know that it is not worth uploading images and setting prices, you also have to do important backroom work, which, analogy to a physical store, would be the tasks of displaying the products in the stores with style. showcases, coat racks and other places in the store.

The choice of lousy images of your products, can cause the opposite effect to the one you are looking for when selling them And your clients are not stupid!

Factors to consider in product images

Thinking that by taking a few photos of the products you are going to sell, uploading them to WordPress, from the product tab, and showing them in the Featured Products view, or individual products, will cause your sales to skyrocket, is having unclear the work that your store requires to “do things right” or better!

There are at least 4 factors that you should consider so that your images are the key to the sales of your products.

  1. That they have a good quality (without going into issues of lighting, angle, etc).
  2. That they are properly optimized so that they do not affect the loading times of your store.
  3. That they show the product in all possible ways (the buyer wants to see in detail what he buys. Holistic vision).
  4. That they be original images, as far as possible yours (made by you) or provided by your wholesaler and not copied from the Internet.

Regarding this last point, although there are many online stores that make a great effort to protect their brands and other visual elements of their stores, it is increasingly possible to find stores that “tracking their images in metasearch engines” it is possible to detect which is their possible origin.

Using images that are not your property can lead to legal problems, and it is possible that you are infringing the copyright of a company or brand. The fact that you have found the images in “Google Images” does not mean that they are freely available.

In relation to the first point, think that if you use low-quality images, with sizes smaller than those that will later be shown on your website, that are blurry, out of focus or with poor lighting, you will be making it very difficult to see them, and with it damaging your own sales

See also  Fees in PayPal API

Edit your images with some existing software on the market, whether paid for like PhotoShop, Adobe Photoshop Lightroom or similar, or free like GIMP, and improve the brightness, contrast, size and other aspects that help improve the quality of the image, and do it before uploading them to your store.

Click on image to enlarge

cure it! use your own images to the best of your ability, even if the initial effort is greater, the reward will also be greater, your buyers will perceive this when viewing your products and it will have a positive impact on choosing your products over those of other stores Similar.

Differentiation has a cost, but it can be assumed, especially if you put time and imagination into it, in the end you will see that taking good photos, even at home, with some LED light bulbs, a tripod so that they do not come out blurry, inert backgrounds (white, chroma key) and then a good edition, you will have great results in what you show in your store.

Image sizes in WooCommerce

Product image sizes in WooCommerce (current versions) are configured from the customizernamely:

Appearance » Customize » WooCommerce

Click on image to enlarge

in the tab product images it is possible to set:

  1. 1:1 size: Images are cropped squarely.
  2. custom size: Cropped to a preset aspect ratio: 4:3, 16:9, etc.
  3. uncropped size: The size and appearance with which they have been uploaded to Media is respected.


Click on image to enlarge

These settings affect the main product image width, product thumbnail width, and thumbnail cropping.

Other additional WooCommerce plugins can influence the final sizes of product images, as well as the Theme used for the Shop.

Notice that I’m talking about image width of the product and not of the height, since this is calculated automatically based on the configuration.

On the other hand the main product image It has no crop setting and will always display “uncropped”.

If you apply changes to the configuration of the WooCommerce product images, new image sizes will automatically be generated, taking up space on your Hosting, always analyze this detail well before launching yourself to tinker with the configurations in search of the ideal size.

Image resets after a settings change are always applied in the background so they don’t affect other tasks you perform in the store, but you can view them from:

WooCommerce » Status » Records

Click on image to enlarge

Make more use of product image galleries

Many of the stores I visit regularly use only the featured image of the product to show it, others, not as many as I would like, if they add one or 2 views of the image, although they tend to focus more on product variations and very few use galleries of images of products to show them in all the ways that have been and will be.

See also  5 WordPress Backup Plugins

Do you go to the greengrocer to buy bananas and you just look at the label and the preview that the seller shows you? …it’s going to be no, right? …you take the bananas, look at them, touch them (you don’t touch the fruit XD) you look at the ones next to you to see which ones are more yellow and less green, and if they have black spots, it’s better, surely they are bananas from the Canary Islands 😉

Well, if you do this in Mariano’s fruit shop, the one on the corner, on your street, why don’t you do the same when you buy products online? and you look in those stores where they have a holistic approach to your productsto make it easier for you to choose them.

The image galleries of a product come to offer that global, personalized and detailed vision of the products that you offer and that every buyer wants to see, on the one hand to satisfy their need to gossip in detail about what they are going to buy and on the other to focus your choice into something concrete based on the details.

You have a clear example in stores like Amazon, where you can see the products at their best represented in great detail, and that is part of the success of their sales.

Gallery of images of a product on Amazon

Well this or better! you should apply it to your products to make them more visible, and buyers become fans of your store.

Remember that WooCommerce allows you import a catalog from a CSV file so that you can incorporate many products at once, especially if you work with brands or manufacturers that already provide you with their products in said format to add them to your catalogue.

Additional images of a product can be uploaded to WooCommerce from:

WooCommerce » Product » Product Gallery

Click on image to enlarge

These images will give extra visibility to each product where you add them and buyers will have a better chance of visually evaluating the product before making a decision to buy it.

Click on image to enlarge

Naturally then there are plugins (usually for a fee) that allow you to give this gallery an “extra” look that is cooler to capture more attention from visitors or potential buyers.

  • WooCommerce Dynamic Gallery – https://es.wordpress.org/plugins/woocommerce-dynamic-gallery/
  • WooSwipe WooCommerce Gallery – https://es.wordpress.org/plugins/wooswipe/
  • Product Gallery Slider for Woocommerce – https://es.wordpress.org/plugins/woo-product-gallery-slider/

There are other plugins, also in codecanyon 😉 but you will have to discover them yourself.

See also  Contact form and MegaQuestion in Prestashop 1.7

Optimize your images to reduce load

This is a classic that you have surely read or have been commented on in a WordCamp or WooCommerce or e-commerce meetups, but it is true, it is a point where stores still fail a lot, by default or excess.

Optimization is critical for the WPO (Web Performance Optimization) or in Spanish, the improvement of loading times and is achieved by optimizing the elements that make up your website, also and very importantly “your product images” and the Theme, in addition to the ones you use on the cover or on your blog.

The more optimized all the elements that intervene in the page of your Store are, the less time it will take for it to load in the visitor’s browser or on their mobile device (even more important).

Do not focus only on making the cover of your store beautiful (the window in the analog vision of a store) and work on all the content, mainly the products and the featured images of each of them and of course the galleries or additional images.

The solution is not always to have a VPS to control the resources that will be necessary to serve your pages to the visitor, or to use an external CDN so that the images and other static elements load at lightning speed, you can save all of that with a good optimization and a lot of field work, in the back room.

At you have a super image optimization plugin “in batch” and “in the background” once you install it and forget about it and it’s also free!

But let Cristina tell you, she does it with much more joy and grace than me.


Is about optimizer.io and you can install it for free on your WordPress “for life” and let it take care of optimizing your images to improve the loading times of your product pages or blog, and incidentally improve your score in Google PageSpeed ​​and others measuring tools.

After uploading it, you install and activate it in your WordPress, then you just have to insert the email with which you have registered on the plugin website and your API Key so you can optimize your images.

Click on image to enlarge

Recommended reading:

Once you start using optimizer.io on your website you forget about the heavy task of having to manually optimize each image, of each product, and so you can use that time for other WPO tasks in your store, or to go out more with friends and do some analog life…

Loading Facebook Comments ...
Loading Disqus Comments ...