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.

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

Setup Color Variant

Halo offers 3 type for Color Variant: Basic Color, Advanced Color and Variant Image.

1. Basic Color

2. Advanced Color

3. Variant Image

Basic Color

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).

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.

Advanced Color

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 Image With PNG Format).

After that, please upload image with the same name as the variant 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 Image

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.