El carro está vacío

Creemos que estás en United States.

¿Quieres actualizar tu ubicación?
País
Idioma

Image guidelines for Shopify, BigCommerce, WooCommerce, and Magento

Everything you need to know about product images for the four biggest e-commerce platforms at a glance.

Launching your e-commerce business and implementing your webshop is exciting and the beginning of attracting new customers, generating awareness for your brand, and fine-tuning your KPIs as you go. One of the most critical assets in your online shop - be it hosted by Shopify, BigCommerce, WooCommerce, or Magento - are your product images. Selecting and smoothly uploading the right visual content to your shop can be challenging - but it doesn’t have to be!  

In this article, we compiled all the insights you need to upload great content for optimal performance on your preferred e-commerce platform:

  • Shopify
  • BigCommerce
  • WooCommerce
  • Magento

If you want to learn more about taking great product pictures that convert, check out or tutorial section giving you insights on how to best capture all kinds of products. Consistency is key when it comes to product photography. To help you get started with building your photography style according to your brand, we suggest working with a style guide.

1. Shopify

shopify.png

Ideal for small to medium-sized businesses, Shopify offers lots of built-in features and an intuitive drag-and-drop design interface - excellent when you have zero coding experience. The platform has around one million users and is one of the most accessible solutions.  

Shopify recommends using JPEG but also supports PNG, GIF, and JPG file formats for your product imagery. JPEG files usually offer a good balance between quality and file size, enabling you to optimally showcase your products while ensuring speedy page loading times. Shopify accepts files of up to 20MB - however, the smaller the image, the faster your site.  

In general, the ratio of your image depends on your particular shop theme. To make your pictures display best universally, Shopify recommends using squared photos for your shop. You can upload images between 800 x 800 and 4472 x 4472 pixels. For optimal results, Shopify suggests going with a resolution of 2084 x 2048 pixels. Do your images have another ratio? No problem! You can manually resize your photos in the theme customizer. The first product image you add to your product will automatically default as its thumbnail but can also be uploaded separately.  

You can upload up to 250 images per product. At StyleShoots, we recommend going with a front, back, side, and at least one meaningful detail shot per product feature. Try not to overwhelm your audience with too many product images. Think about the questions customers may have about your product and try to answer them with your visual content.  

2. BigCommerce

big-commerce.png

A relatively easy-to-grasp interface and smooth integration with third-party apps make BigCommerce an exceptionally scalable e-commerce solution for larger businesses. For example, by offering seamless integration with Google Merchant Center, BigCommerce enables users to promote their products on Google Shopping directly - one less thing to worry about!  

Like Shopify, BigCommerce recommends using JPEG files for your product pages but also supports PNG, GIF, and JPG formats. You can upload up to 25 images to your page, preferably in square format, to make sure they display correctly across devices. BigCommerce suggests a resolution of 1280 x 1280 pixels. If large enough, your image will automatically be scaled down to be used as a thumbnail. Enabling product zoom for your images allows for a higher resolution image file.  

A great feature BigCommerce offers is its automatic image optimization for photos uploaded to its storefront. Collaborating with third-party content delivery network Akamai, images are automatically resized based on the device your customer is using to check out your site. This not only allows for faster page loading times but also less work per user.

3. WooCommerce

woo-commerce.png

The most popular free solution for e-commerce platforms, WooCommerce is a highly customizable open-source plug-in. It’s perfect for beginners and doesn’t require any special skills when setting up your webshop. However, you have to look for a hosting platform yourself to launch your WooCommerce store. 

WooCommerce supports formats such as JPG, JPEG, PNG, GIF, and ICO but recommends using JPEG for photos and PNG for graphics. WooCommerce lets you upload as many product pictures as you like to your page.  However, you may have an upload limit depending on your accompanying hosting plan. While the image ratio is customizable, a 1:1 format of at least 800 x 800 pixels is recommended. If you go with a lower resolution, you won’t take advantage of the zoom functionality.  

There are several image types on WooCommerce. The Single Product Image is the largest and refers to the main image on your product page. Catalog Images are medium-sized images for category pages and product recommendations. Lastly, the Product Thumbnails are the smallest images used for cart, widgets, and optional product galleries.

4. Magento

magento.png

A tad bit more complex than the previously mentioned solutions, Magento is built for custom e-commerce solutions that can easily scale in the long run. With customers like Nike, Helly Hansen, or Nespresso, the Adobe Commerce platform offers various features for the more skilled developer.  

Like Shopify and BigCommerce, Magento recommends using JPEG files for your imagery but also supports PNG, GIF, and JPG files of up to 4MB. You can upload between two and fifteen images to your product page. You guessed it - also Magento recommends uploading squared product photos. Those photos should have a resolution of 1100 x 1100 pixels to take advantage of the zoom functionality and 470 x 470 pixels if not. Magento will automatically resize larger image files if you enable the appropriate option in your settings.  

You can find four different image types within your Magento shop. The main product image (Base image) is the featured image on your product detail page - with or without zoom, depending on the resolution you chose. With 470 x 470 pixels, the Small Image is shown on category pages, search result pages, and product recommendations. Thumbnail Images are displayed in your gallery, shopping cart, and when featured among related items. Lastly, Swatches are meant to show colors, patterns, and textures. Both Thumbnails and Swatches come down to 50 x 50 pixels per image.


 

Next to the specific image requirements per platform, there are some general aspects to keep in mind when preparing visual content for your webshop. When launching your e-commerce platform, you want your customers to find their way to your shop with ease. Don’t miss out on organic site traffic and optimize your images for SEO. Use informative file names for your photos and include appropriate alt text that matches relevant search terms your audience may use to find your products.  

Once you’re getting started with visual content creation, think about a file naming structure that makes sense for your products and is scalable in the long run. For most platforms, image file names are restricted to letters from a-z, numbers from 0-9, hyphens, and underscores. Therefore, avoid spaces or special characters in your filenames.  

The four introduced e-commerce platforms differ not only in their image guidelines but also in their use cases. On all platforms, squared product images work best across devices. Always keep your file size in mind. JPEG files usually offer a good balance between file size - page loading time - and quality.