Roller theme: How to create swatches

Modified on: Wed, 31 Jul, 2019 at 2:42 PM

On this page:

A. What are swatches?

B. How to create swatches

A. What is color swatch for?

Swatches allow you to groups different products into separate groups based on common characteristics (such as color and size). They can help visitors choose their variants with better demonstration.

For example, one print-on-demand product with same design in different styles (hoodies, sleeveless, T-shirt) with swatches such as colors and sizes as below:

B. How to create swatches


1. On your ShopBase admin page, go to Product > Edit product. Find Variant section.

2. Select Group your variant by one option. For example, with Hoodie and Sleeveless for the Style of a product, there will be 2 groups.

3. Go to Roller theme editor > Settings > Product Grid. 

4. In Product Form section, select Enable variant group swatches:


  •  1 variant's product image of each group will be chosen to make swatch for that group. Therefore, the condition is that each group must have a unique variant image. If there's no unique image for one group, no swatches can be shown for this product.
  •  The option you want to group your variants to make swatches should be first option of your option list.
  •  By default, the product will be grouped by first option (when importing and adding products)

If you need our assistance with the steps, don't hesitate to shoot an email. We are here to help!

ShopBase team.

Did you find it helpful? Yes No

Can you please tell us how we can improve this article?