For an apparel product, color terms can appear as circles or squares while sizes use text labels. For fabrics or wallpaper, image terms can show patterns at a glance. Smart Variation Swatches for WooCommerce Pro lets stores configure these choices for variable products.

Choose an attribute show

• Color: Assign hex-based colors to terms and show them as circles or squares.
• Image: Upload thumbnails for patterns, finishes, styles, or product photos.
• Button/Label: Present short text choices such as sizes, materials, or pack types.
• Select: Keep the native dropdown when a list works well for the options.
• Radio and Checkbox: Use these Pro attribute types for form-style choices.

Product pages and catalog browsing

Global attribute options help keep shows consistent across a shop. Product-level configuration and Pro overrides support products with one attribute or several, including combinations such as color and size.

Pro adds advanced archive options to control where and how swatches appear on shop and category pages. Its enhanced filter widget lets users filter by color, image, and other attributes through a swatch interface in sidebars and widget areas. Priority support is also included.

Style settings cover shape, size, spacing, borders, button colors, tooltips, out-of-stock display styles, and hiding the original dropdown. Apparel, beauty, home décor, furniture, electronics, and phone-case catalogs can use the available formats for colors, shades, patterns, finishes, or other product options.

Setup and styling

1. Install and activate Smart Variation Swatches for WooCommerce Pro, then open Variation Swatches → Dashboard.
2. Go to Products → Attributes and pick an attribute type: Color, Image, Button/Label, Select, Radio, or Checkbox.
3. Configure the attribute terms, assigning colors or uploading images where applicable.
4. Add the attribute to variable products and create their variations.
5. Open Variation Swatches → Settings to adjust style and tooltip options.

The extension works with most WooCommerce-ready themes. Highly customized variation templates may need light CSS or template adjustments to match the theme.