Configure on Product & Collections Page

Let’s understand the pre-defined swatch style configuration step-by-step for the Product page:

• On the product page, it is activated by default

• On the collections page, you need to activate it as shown in the snapshot

1. Swatch Configurations - Product & Collections

• Product - Click on default and choose a style (Circular, Square etc.)

• Collections - Click on default and choose a style (Circular, Square etc.)

2. Select Swatch Type

Select the Type - Variant Image or Custom Co (available for both Product and Collection options)

• Select the Variant Image option to display the default Variant image on swatches.

• Select Custom Color/Image to display custom color/image on swatches.

3. Preview option

You can open the product page from the app to check the implemented configurations.

4. Visibility

• Product Page

• Collection Page

To customize the Product or Collection swatches, go to Swatch Styles and customize the styles according to your requirements.

Swatch styles