Color/Image Swatches

To set a Color Swatch type or an Image Swatch type of product, your product must be a Variable Product and has corresponding attributes. If those attributes have not been created yet, please follow these steps to know how to add a new attribute.

1. Attributes


Go to Products > Attributes. In the Add new attribute area, fill in the form to create a new color attribute:

To add a new color, fill in the form Add new Color name of the color, then select its shown color from Color Chooser as below. Finally, remember to click Add new Color button:

Select a product you want and edit it. Then go to its Product Data and change it to Variable Product.

Then, go to Variations and add variation.

Go to Attributes and add color and size attributes to the product with these settings:

You will then get a result that seems like this.

The next step set a regular price and fill your price in each Variation. Also, change its feature image for each color.

2. Image Swatch


Simply go to Products > Attributes > Color then change the swatch type into Custom Image. Then, you must provide an image for each Variation by clicking the Edit each Variation and upload its image.

You will then get a result like this.

Finally, save all the changed settings, update your product and do to its Product page to check your product. Remember to choose the size first then choose the type color (image).

3. Video Description