What happens when a customer selects a swatch

Product Variations Swatches for WooCommerce Pro presents product attributes as buttons, colors, images, variation images, or radio swatches instead of standard dropdowns. Customers can view and select available choices, such as color or style, on product pages.

When a customer selects an attribute term, the add-on can change the product picture. This works with different swatch types and can use an image assigned to each term. When enabled, selecting a term can change the product photo.

Set attribute presentation

For global attributes, find an existing attribute in the swatches settings, choose horizontal or vertical display, assign a swatch type and profile, then edit its terms. You can also choose which attributes appear in product lists.

Pro includes the free version's functions and includes settings for custom attributes on variation products. Enter the name of an existing attribute, choose the product categories where the customization applies, and select its display style.

Control profiles and tooltips

Create unlimited swatches profiles or duplicate an existing profile for another design. Profile settings include the name, padding, height, width, font size, mobile size, product-list size, color, and box-shadow effect. Hover and selected states can have different colors, backgrounds, borders, box shadows, and sizes.

Tooltip settings include color, border, font size, and position. Tooltip content can be changed and can use an attribute or variation image.

Configure catalog and stock states

Choose whether particular attributes appear in product-list views. The extension can also detect out-of-stock variation items and display them blurred or crossed out. Set whether those items remain clickable or are hidden to control how unavailable combinations appear during selection.

Installation and compatibility

Install and activate the plugin on a WooCommerce site, then open its swatches settings. Select an attribute, choose horizontal or vertical display, assign a display type and profile, and edit the relevant terms. Create or duplicate profiles, configure tooltips and selected states, then enable product-image changes or out-of-stock behavior as needed.

The supplied compatibility information lists WooCommerce 7.x or higher and PHP 7.0 or higher. The plugin is designed for mobile devices and has an interface for configuring variation swatches.