ShopBase Help Center

Explore How-To's and learn eCommerce best practices from our knowledge base.

Home
Theme
Create and enable variant group swatches with Theme Editor

Create and enable variant group swatches with Theme Editor

This article is also available in:
Chinese Vietnamese

With ShopBase, you can group different product variants into groups based on common characteristics (such as color and sizes). Each group swatch will be presented by an image (or color for color swatches). In this article, we will show you how to create and enable variant group swatches for your products.

Example of variant group swatches

In this article

A. Create variant group swatches

B. Enable variant group swatches

A. Create variant group swatches

From your ShopBase admin site, go to Products > All products and select the product you want to edit.
In Variant section, add variant images to show swatches. Please refer to this article on how you can set up variant images for your product.
Then, enable Group your variant by this option and select the desired option. Your variants will be divided into groups, and the option you select will display product images on the product page.
Once finished, click Save changes.

B. Enable variant group swatches

From your ShopBase admin site, go to Online store > Themes. Select the theme you want to edit and click Customize.
In Settings tab, click on Product.
Next, enable Enable variant group swatches.

In Options settings > Swatches, select Enable variant group swatches.

Next, set up variant selector in button style.
Navigate to Variant style (Option Style), select Buttons.
Once finished, click Save.

Each variant must have at least one unique image. If there's no unique image for one product variant, no swatch will be displayed for this group.

Swatches (including variant group swatches and color swatches) can be displayed for any variant option in your option list if they are correctly set up.

If color is set as first option, product images will be shown instead of color swatches.

By default, the product will be grouped by first option (when importing and adding products).

Add product variants
Set up variant images for your product
Enable color swatches with Theme Editor