Tips, WooCommerce Tutorials

How to Add Additional Variation Images in WooCommerce

By the end of this tutorial, you’ll know exactly how to include additional variation images for your products in WooCommerce. The best part? You’ll be able to do it in 2 steps with the WooCommerce additional variation images plugin, WooThumbs for WooCommerce

woocommerce additional variation images

A default WooCommerce install doesn’t allow you to include additional variation images for your products. In fact, it only allows you to add one. 

This poses a problem for WooCommerce store owners who want the freedom to show their products from different angles, perspectives, and in detail. So, we’re here to solve that problem for you.

Get WooThumbs for WooCommerce

Install WooThumbs for WooCommerce and instantly include additional variation images for your products in WooCommerce.

or learn more

How the WooCommerce plugin, WooThumbs for WooCommerce works 

WooThumbs for WooCommerce allows you to add an unlimited number of extra images to your product variations. These images are all shown in the product image gallery.

When a customer visits a single product page, they’ll be able to select the variation they want to view and scroll through multiple different image variations for that product. 

woocommerce additional variation images

As a bonus:

  • Add unlimited images to your product variations.
  • You’ll be able to display only images of the selected variation to improve customer understanding.
  • You can also bulk edit variation images if you need to.

Of course, that’s not all WooThumbs can do. It also allows you to:

  • Choose between a horizontal slider/carousel, vertical slider, or fade effect for your product gallery.
  • Adjust thumbnail image spacing, icon colors, transition speeds, and more.
  • Embed video content into your gallery from YouTube and Vimeo. Or upload directly to WooCommerce.
  • Show off your product to the fullest with smooth image zoom, customizable display modes, and an enlarging single image lightbox/popup for a better view.
  • Works well (has good compatibility) with any WooCommerce theme and/or template.
Outer Zoom WooThumbs

So now we know what WooThumbs for WooCommerce can do. Let’s get it added to your site and include more product variation images on your ecommerce store.

How to add additional variation images in WooCommerce

To add additional variation images in WooCommerce, you’ll need to:

  1. Install the WooCommerce image plugin, WooThumbs for WooCommerce.
  2. Add your additional variation images.

That’s it. Below we’ll outline these steps in detail so you can start making more sales for your online store.

Step 1: Install WooThumbs for WooCommerce

To get started, purchase WooThumbs for WooCommerce from the Iconic store: iconicwp.com/woothumbs

Then follow these steps:

  1. Go to Plugins > Add New > Upload Plugin.
  2. Choose the zip file you downloaded, upload, and then click Activate.
  3. Once activated, you’ll need to enter your license key.

Now that we have WooThumbs installed, we can move on to uploading your additional variation images.

Step 2: Add your additional variation images

Adding additional variation images with WooThumbs doesn’t take long, so let’s walk you through it.

To include additional variation images in your WooCommerce store, follow these steps:

  1. Go to Products > All Products.
  2. Edit the variable product you want to add additional variation images to.
  3. Scroll down to the Product Data section of the single variation page (usually found below the main text/product description area).
  4. Select the Variations tab on the left.
  5. Click the expand arrow on the variation you want to add additional images to.
WooCommerce variations
  1. Click the Add Additional Images button underneath your existing image and the media gallery will pop up.
add additional images WooCommerce
  1. Select one or more variation images you want to add and once happy, click the Add to variation button.
variation images WooCommerce
  1. You’ll now see the additional variation images in the Variations tab.
variation image settings WooCommerce
  1. Once you’ve customized all your variations, hit Save Changes in the Product Data section of the page and then scroll up to the Publish section of the page and click Update.

Note: Once you’ve added additional variation images for your WooCommerce product, you can re-order them by dragging and dropping them in the Variations tab. You can also remove any unwanted images by hovering over them and clicking the minus icon.

Manage your additional variation images in bulk

WooThumbs allows you to manage your additional WooCommerce variation images in bulk to save you some time.

To manage your variation images, do the following:

  1. Go to WooCommerce > WooThumbs > Bulk Edit.
  2. Here you’ll be able to see all your WooCommerce products with additional variation images.
    1. This page shows the Variation Name, its Parent Product, and the ID (a number given to each image you upload to WordPress) of the variation images you’ve added.
bulk edit variation images
  1. To add additional variation images in bulk, simply add the Image ID of each image next to the existing number in the Images column. These should be separated by a comma and with no spaces like below:
product image ID WooCommerce
  1. To make these changes, you’ll need to have already uploaded your additional variation images to the WooCommerce media gallery.
    1. Go to Media > Library and click the list icon in the top left.
    1. Here you’ll be able to find the Image ID, like in the screenshot below:
Image ID WooCommerce
  1. Once happy, click the blue Update button on the Bulk Edit Variation Images and your variation images will be updated.

Import WooCommerce additional variation images

If you already have your WooCommerce store set up, with all your products already listed, then adding your additional variation images individually could be a pain.

With WooThumbs for WooCommerce, you can import these extra images to save you a load of time.

To do this, take the following steps:

  1. Create a CSV file with your additional images. A more detailed guide to this can be found in our import doc.
  2. Once done, you’ll need to import it. From your WordPress dashboard, go to Products > All Products and click the Import button.
  3. Upload your CSV file and click the checkbox next to Update existing products. Then click Continue.
import variation images WooCommerce
  1. You’ll next need to determine which fields to import. In this case, we only want Images.
  1. Then click Run the importer and your new images will be added to the shop page (frontend of your store).

Add additional variation images to your WooCommerce store

That’s it, your store now has the ability to include additional variation images on its product pages. With this up and running, you’ll be able to give customers a better look at your variations. As a bonus, you’ll have an upgraded product gallery to go with them.

Make these changes quickly and easily with the best WooCommerce variation images gallery plugin, WooThumbs for WooCommerce.

Get WooThumbs for WooCommerce

Install WooThumbs for WooCommerce and instantly include additional variation images for your products in WooCommerce.

or learn more

Need any help with optimizing your variation image sizes? Check out our guide to managing WooCommerce images sizes and quality

Avatar

Gina is our in-house content creator and partnership manager. She’s passionate about working with plugin companies with copywriting/storytelling, content creation & marketing.

She can typically be found tending to her vegetable garden, writing, and travelling to mainland Europe.

0 Responses

Leave a Reply

Your email address will not be published. Required fields are marked *