Checking Your Woocommerce Product Image Resolution/Size

Checking Your Woocommerce Product Image Resolution/Size

To check to see what resolution and size your product images should be follow the below instructions. 

Navigate through Appearance -> Customise -> Woocommerce -> Product images

image.png

Main image width is the width to be used for the single product and the shop pages. 
 
If 1:1 ratio is selected, it is best to have the image height the same as the image width since it is a square. In this example, the Main Image Width is set to 600 pixels and the ratio is set at 1:1 therefor the size of the image should be 600x600 pixels. 
 
 
To make sure that you are using the same image dimension as CRU used during development, best to check an early product image that CRU added.
 
Under the product edit page (on an originally created product if still available), click the product image.

image.png

On the popup, check the resolution under Attachment Details
image.png

Be mindful of the file size as well. Try keeping well under 200kb for product images, otherwise, this will slow the website page load down. 


This should be the template you use for the products. Notice its PNG file type so it removes the background. 


    • Related Articles

    • Adding Product Images and Galleries

      Note: The below is dependant on the design of your website. Please reach out to support if you have any specific questions regarding your websites product image dimensions Images are measured and set in pixels, for example, 800 x 800 pixels. Note ...

    • WooCommerce Customizer – Manage Store Notice, Catalog View and Product Images

      WooCommerce Customizer is part of WordPress > Customize and makes it possible to select options that apply site-wide for Store Notice, Product Catalog and Product Images without touching any code.  Where to find WooCommerce Customizer From the ...

    • Basic Woocommerce - User Guide

      For pricing and how to add to your website see at the bottom of the page. Adding and Managing Products Adding a product Before adding your first product, let’s get familiar with how product categories, tags, and attributes work. Product Categories ...

    • Product Feed PRO for WooCommerce - User Guide

      For pricing and how to add to your website see at the bottom of the page. Setting-up your first Facebook catalog / Instagram product feed navigate to the ‘Create feed’ section: 1. The File name, format and channel page Project name: Make sure you ...

    • Configuring WooCommerce Settings

      On this page, we walk through all settings available to you in WooCommerce (some add-ons will embed their own settings in this area) You’ll find information about configuring General WooCommerce settings as well as Product, Tax, Payments, Shipping, ...