Adding Color Swatches

To add swatches to your product pages, follow these steps:

1. Insert the Variant Color Swatches component. You can find this under 'Product' in the Components list in the plugin.

2. Connect the options in the component to the matching variable:

1. Under Color Mapping, you will see the option to add your color variants:

1. Add in all your color variants, making sure you use the exact name you used for your color variants in Shopify (case-sensitive!). Add in your HEX color you wish to use.

That's it! Test the color swatches on preview or a published domain. You are able to change styling settings under 'Styling', including things such as default border color and selected border color.