How to Resize Product Images in WooCommerce

Don’t you know how to set the size of product images in WooCommerce? Let’s find the answer!

So, WooCommerce offers to its users the next 3 sizes:

  • woocommerce_thumbnail – for product cards in the catalog;
  • woocommerce_single – for product page;
  • woocommerce_gallery_thumbnail – for product gallery thumbnails on the product page.

We’ll look at them one by one.

Setting Size for Product Images in WooCommerce

  • woocommerce_thumbnail

Choose this size to display product cards in catalogs.

You can find the settings for this image size in the customizer (Appearance> Customize> WooCommerce> Product Images) and they may seem a little unusual. By the default is 600, cropping 1×1.

  • woocommerce_single

The woocommerce_single image size is displayed directly on a product page. In addition, it is not cropped. This means that the image proportions are preserved (what was vertical remains vertical).

The width setting of this size can be changed in the customizer (Appearance> Customize> WooCommerce> Product Images). The default width is 600px.

  • woocommerce_gallery_thumbnail

This size is for thumbnails. By default, It’s 100×100, scaled and cropped firmly to this size and does not have specific settings in WooCommerce.

Many thanks for your attention. Wait for more tutorials!

featured