Swatchly allows you to enhance the product browsing experience by configuring attributes and enabling different swatch types, such as image and color swatches. Additionally, tooltips can be enabled to provide additional information to customers. Follow the steps below to configure attributes and enable swatches accordingly.
Step 1: Starting Configuring Attributes#
Before enabling swatch types, ensure that your product attributes are properly configured in WooCommerce. To configure attributes:
- 1- Select “Attributes” from the Dropdown: From the Products section, select “Attributes” from the dropdown menu.
- 2- Add a New Attribute: Click on the “Add New Attribute” button. Enter the attribute name (e.g., “Color”) and attribute type(e.g., “Label,” “Color,” “Image”). Click “Add Attributes.”
Step 2: Configuring the terms of the Attributes #
In WooCommerce, configuring the terms of attributes involves setting up the specific values or options available for each attribute. These terms represent the different variations or options that a product can have within a particular attribute.
- After adding attributes, you'll need to set up the terms for each attribute. Click on the “Configure terms” button next to each attribute to proceed with configuring its specific terms or options.
- In this example, we'll focus on configuring color options for a specific attribute. There are four components you can define for each color option: the color name, slug (unique identifier), a brief description, and a color selector to visually represent the color. Customize these options based on your preferences. Once satisfied, click the “Add New Color” button at the bottom to include it in the list.
- You can add as many attributes as you need based on the requirement. Once you have added the terms, the final screen would like the below image.