Vario
  • Intro to Vario
  • Setup Guide
    • Install app
    • Basic steps
    • Add product variants
    • Set up variant option styles
    • Customize swatches
    • Customize variant swatch effects
    • Automated variant image swatch
    • Add custom CSS to theme
    • Home page
    • Integrations
      • PageFly
      • Transcy
      • ETranslate
      • Translation Lab
  • FAQ
    • Questions
    • Known issues
  • Support
    • Plans
    • Contact
    • Changelog
    • Troubleshooting
      • How to approve our collaborator request
Powered by GitBook
On this page
  • Assign images to product variants
  • Enable automated variant image swatch
  1. Setup Guide

Automated variant image swatch

How to automatically populate variant images as image swatches

PreviousCustomize variant swatch effectsNextAdd custom CSS to theme

Last updated 3 years ago

This section shows you how to set up automated variant image swatches the fastest way.

With this new built-in feature, you will save more time because you don’t have to upload variant image files over again.

Assign images to product variants

In this step, you’re supposed to already .

For instance, I have a product with 1 product option “Color” which has 6 variations. So I carry on assigning 6 images to those 6 variants.

Shopify product variants images

Enable automated variant image swatch

1. Sync

From your Shopify admin > Apps > Vario > click Refresh to update new product variant changes.

2. Choose Automated

Go to the product option and choose Automated variant image swatch style.

By enabling this automated feature, all the existing variant images will be automatically assigned to their swatches.

3. Finish

Now all left to do is to click Save and view your product page.

My 6 existing variant images are now automatically assigned to image swatches like this.

automated Shopify product variant image swatches
Shopify store product page with automated variant image swatches
add the corresponding image for each variant swatch