Variation Swatches for WooCommerce

Variation Swatches for WooCommerce transforms boring variation dropdowns to nice-looking swatches.

If you’re running a WooCommerce store, it’s obvious you want to provide the best shopping experience to your website users. The better the experience you offer your users, the more likely they are to purchase from your store.

The ability to view multiple variations of a product is very important while browsing for products. The shopping experience for customers can be enhanced by making the products look a little more appealing.

One of the ways to bring more life into products that have variable attributes, is to add the color attribute. The default variation options that come with Woocommerce don’t exactly follow the best UX trends and useful design like we know is really important these days. Having a well-structured site that appeals to your clientele is critical since it affects your conversion rate. By installing Woo Variation Swatches plugin, your customers will be able to view your variation products in different available colors and sizes in a much smoother way!

3 types of swatches are available, Color, Image and Label. Image swatches will automatically be applied for variation color attributes that contains an image. Swatches can also be enabled within the catalog page as well as any product quick view modal.

With a friendly and easy-to-use interface, you can add a default color, image or label to each attribute in the attribute management page.

👉 Official Site |  Official Demo

Features

• Live Preview Customizer (All Options)

• Attribute types: (Dropdown, Label, Color, Image)

• Customize options for single product / archives independently

• Automatically convert Dropdowns to Label Swatch by default

• Automatically convert Color Dropdowns to Image Swatch

• Attribute Label Position (Above / Before Swatches)

• Hide Attribute Label

• Hide Variation Reset Link

• Attribute Quick Edit Supported

• Swatch Styles: (Square, Circle, Rounded)

• Adjust Swatch (Width, Height, Alignment)

• Adjust Swatches Container Spacing

• Adjust Swatch Vertical & Horizontal Gap

• Adjust Swatch (Width, Height, Font Size, Colors)

• Enable Tooltip (Text or Image)

• Adjust Tooltip Background & Text Color

• Adjust Tooltip Image Size

• Adjust Tooltip Border Size & Radius

• Override global swatch settings within product page

• Mix swatch types for the same product. ex. Image / Color

• Enable Catalog Mode

• Support display in Quick Views