Setting Up Product Swatches (Color, Image, Label)

1. For your Product data, select Variable product

2. Click on Inventory Tab

3. Enter your SKU and other settings if required

4. Click on Shipping Tab

5. Enter your product Shipping Details (i.e weight, dimension, shipping class)

6. Click on Attributes Tab

7. Choose Your Custom Product Attribute (color, image or label) and press the Add button (In this case, we use Color)

8. Choose a list from available Color Attributes or you can press on the Add New button to add Color, Image, Label on-the-go.

To add terms on the go (color, image or label), follow steps below

a. Click on Add New button in Attributes Tab (after choosing Custom Product Attribute either for Color, Image or Label)

b. Enter your Term name

c. Select Your Term Color, Image or Label

d. Click on the Add New button

9. Tick the Used for Variation

10. Click on the Save attributes button and don’t forget to Update and save your Product.

11. Here’s where the step that you’re almost can get your color swatches to be shown at frontend, Click on Variations Tab

12. Choose Create variations from all attributes and click Go

* You will see that your variations will be generated as below

a. You can click on a variation to edit a particular variation

b. Hovering a variation will allow you to reorder (3 lines hamburger icon) or remove the variation

13. Upload an image that match the color/image/label of your Product Variation (i.e Blue iPhone)

14. Ensure that this variation is Enabled in order to be shown to public

15. Set the Prices

16. Set Stock Status

17. Press Save changes, and your done! Now, finally your Product Swatches will appear at fronted as illustrated below.