Product Variant

You add variants to a product that comes in more than one option, such as size or color. Each combination of option values for a product can be a variant for that product. For more information, see Variants.

Bonnita offers 2 type for Product Variant: Dropdown and Square / Rectangle / Swatch. For more information, see Swatch.

Setup Color Variant

Bonnita offers 3 type for Color Variant: Basic Color, Custom Color and Variant Image.

Basic Colors:

1. From your Shopify admin, go to Online Store -> Themes.

2. Find the theme that you want to edit, and then click Customize.

3. Click Theme settings -> General.

4. Scroll to Swatch and choose Type as Basic Color (Use Color Name or Image with PNG format).

You need to make sure your color name match with the color name at: http://www.w3schools.com/tags/ref_colornames.asp. If the color name doesn't exist on the w3schools website, it will not display on your site.

Custom Colors:

If your products have custom colors/ special colors, you can follow below instruction:

• From your Shopify admin, go to Online Store -> Themes.

• Find the theme that you want to edit, and then click Customize.

• Click Theme settings -> General.

• Scroll to Swatch and choose Type as Basic Color (Use Color Name or Image with PNG format).

After that, please upload an image with the same name as the color name (Go to Settings → Files -> Upload Files).

Naming convention: Lower cap and use a hyphen "-" to replace white space if your color image name has the white space. For example: your special color will have this name: "Holo Rainbow", you will upload the png image is holo-rainbow.png

Variant Images:

1. From your Shopify admin, go to Online Store -> Themes.

2. Find the theme that you want to edit, and then click Customize.

3. Click Theme settings -> General.

4. Scroll to Swatch and choose Type as Advance Color (Use Variant Image).

For more information, see Adding images to product variants.