Configuration of Terms

Once you have created an attribute, you have to add variations of it. Click on the button shown to enter the first variation.

Configure Terms

To add a new color, specify the following required options:

  • Name : Color name (shown in frontend).
  • Slug : Slug for attribute variation.
  • Description : Description associated to the attribute variation, shown in front end.
  • Color picker : Choose the color you want to assign to the current attribute variation using a color picker.
  • Tooltip : Tooltip associated to the attribute variation and shown in product page.
Add Attribute Terms

You need to specify {show_image} for the attributes of image type in Tooltip entry if you want to show as tooltip the selected image preview for that specific term.
Note: Only available for the Image type.

Placeholder {show_image}
Output after adding {show_image}

In our example, we have entered the following colors:

  • Blue
  • Red
  • Black/Red
  • Gray
  • Gray/Blue
  • Red/Blue
WooCommerce Color Variation

You can create new product variations directly from the product detail page.

Open a product. Then add an attribute & click on Add to add a new variation.

Add New Variation when creating Product

In our example, the attribute type is colorpicker and, therefore, in the modal window that opens we will have to add colors for the new variation.

Add Color Variation when creating Product

WooCommerce Variation Swatches plugin allows configuring a term for the attribute by matching two colors.

Click on the specific button to select the second color.

2 Colors Term

Product’s frontend output using WooCommerce Variation Swatches for the attribute by matching two colors.

2 Colors Term at Front