Swatches

Swatches provide an alternate way to display the selection of options for configurable products. Rather than choosing an option from a drop-down list, customers can make their selection by clicking a swatch. Configurable swatches can be used on the product page, product list, and in layered navigation.

In this section, you will learn how to use swatches to make the presentation of configurable products more appealing and informative. Click through the slide show for a quick overview. To jump to the topic, click the title of the slide.

• How Swatches are Used

  Swatches make the presentation of configurable products more appealing and informative. Swatches can be used on product pages, in product listings, and layered navigation.

  Swatch Configuration

  The configuration enables swatches, and determines the swatch sizes used on product and product list pages, and layered navigation.

  Adding New Attribute Values

  As you add products to your catalog, you will need to update the attribute values that correspond to each swatch.

  Preparing Swatch Images

  The size of the swatch that is set in the configuration, and the size of the uploaded image determine the level of detail that can be seen in the swatch.

  Uploading Swatch Images

  The swatches folder in Media Storage is the most common place where uploaded swatch images are stored.

  Swatch Images Cache

  Whenever changes are made to existing swatch images, the swatch cache must be flushed before the changes can be seen in the store.