To install the add-on, follow the guidelines from the section Installing Add-ons from the X-Cart App Store.
After the installation, proceed to the settings page to configure the ad-on
The "Color Swatches" add-on settings page looks as follows:
Box width and Box height: Set the swatch images' dimensions (height and width) in the customer storefront.
Use color swatch name as an attribute option name: Enable the toggle to use the color swatch name as the name of the product option.
For example, suppose you have a product attribute "Color" with values (options) defined as "red," "blue," and "yellow," and the color swatches added to those values as "swatch_1", "swatch_2" and "swatch_3" respectively. The toggle "Use color swatch name as an attribute option name" will affect what your customers see when hovering their cursor over the color swatch boxes on the storefront. If the toggle is disabled, the name of the option will display as "red," "blue," or "yellow." If the toggle is enabled, it will display as "swatch_1", "swatch_2," or "swatch_3", respectively.
After adjusting the settings as you require, be sure to click "Submit" to make them active.
Read on: