WPC Variation Swatches for WooCommerce


WPC Variation Swatches for WooCommerce will definitely kill the game for online shops and WooCommerce sites with an elegant, responsive look and impressive effects. There’s no better way to showcase your products in the best look and assist customers in choosing their preferred options. WPC Variation Swatches offers a variety of predefined styles for attributes of variable products, with the ability to use different selector types on a single product page and position tooltips at the best position for a great match with your theme/template.

More remarkably, WPC Variation Swatches is fully compatible with other WPC plugins, which offers the chance to use swatches on a Smart Bundle, Frequently Bought Together, Force Sells or Smart Grouped Product without the need to worry about the compatibility and experience.

Live demo

Visit our live demo here to see how this plugin works.

Key Features

  • Exquisite display for attributes & variations of variable products
  • Automatically set button swatches as the default type for all custom attributes
  • Allow multiple selector types in a single product page at users’ preferences
  • Up to 5 types for individual attributes: select, radio, button, color, image
  • Two elegant styles for bordering: square or rounded
  • Show/hide or choose a position for the tooltips
  • Blur out for inactive variations
  • Responsive display for both desktop and mobile devices
  • Enable/disable click again to undo the selection on current attribute
  • Enable swatches for shop/ archive page
  • Compatible with other WPC special product types: Smart Bundles, Grouped Product
  • Compatible display when added as Bought Together or Force Sells items
  • Optimized for supporting better display in RTL languages
  • WPML compatible for building multilingual sites

Wanna save your precious time working on variations? Try our brand-new free plugin WPC Variation Bulk Editor and WPC Variation Duplicator.

Various Selector Types On A Page

A notable highlight in the feature list of the WPC Variation Swatches plugin is the possibility to use up to 5 different types for attributes on a single product page.

From the admin dashboard, navigate to the Products section >> Attributes >> in the Type option of each attribute, click on the list you can find 5 different types:

  • Select (dropdown, default)
  • Radio
  • Buttons
  • Image
  • Color

For variable products that have 5 attributes as in our live demo, you can choose a suitable type for each attribute based on your preferences. This is truly useful for optimizing the appearance and arranging your product page for optimal user experience.

Buttons As Default Type For Custom Attributes

From the plugin settings, choose “Yes” for the “Button swatches by default” option to set button swatches as the default type for all custom attributes. This will save time when users need to configure the swatches type in bulk.

Note: Except for 2 default attributes by WooCommerce (size & color), all other custom attributes with a different name from these are supposed to have the default dropdown (Select) type. Turn this option on will replace the dropdown with button swatches for all custom attributes on your store automatically.

Other alternatives you might also like



  1. Please make sure that you installed WooCommerce
  2. Go to plugins in your dashboard and select «Add New»
  3. Search for «WPC Variation Swatches», Install & Activate it
  4. Go to WP-admin > Products > Attributes to configure for attributes and terms


9. februar, 2024 1 svar
I think it’s important to mention that this plugin has two major benefits the other free «variation swatches» plugins do not deliver. It can show variations on shop/archive pages, not just the single product pages. Some of the other do this too, but not all of them. It has a shortcode, which means you can insert it into Elementor loops when designing your own shop/archive grid templates in Elementor. None of the others free ones do this. My only major gripe with this plugin is how much custom CSS it takes to make the layout halfway decent. The default swatch thumbnail sizes are too tiny for 1080p monitors, this takes points off for frontend UI usability. It needs options to center the swatches in the box on product archives/shop pages, it needs more modernized frontend code for better layout control. The appearance on single product pages is pretty atrocious, with a forced background color that the settings won’t let you remove, so again, CSS is needed. The alignment of the labels and image swatches is random and seems to have no respect for margins.
2. september, 2023
Hello, It appears in products other than the products I selected,
7. juli, 2023 1 svar
WPC Variation Swatches is the best plugin i have ever found to do my SEO marketing. You can easily change every variations Title and description for SEO purposes. The title and description are the first thing that google notices for rankings keywords..You can put your desired keyword or any other relevant words to title and description to each of the variations to help your single product rank in the 1st position easily. Wpclever Team has tremendous fast support if you face any issue, specially I want to thank Dustin H. & Janilyn for their continuous support to us.
3. februar, 2023 1 svar
This plugin works perfectly and does exactly what it should without bloat, without needing extra plugins or purchasing premium version for variations in archive page etc.Also the developer provides immediate support and frequent updates.I use it extensively on custom designed websites with oxygen builder.
Les alle 7 vurderinger

Bidragsytere og utviklere

“WPC Variation Swatches for WooCommerce” er programvare med åpen kildekode. Følgende personer har bidratt til denne utvidelsen.




  • Fixed: The more button for the archive page


  • Fixed: Minor CSS/JS issues in the backend
  • Updated: Compatible with WP 6.5 & Woo 9.0


  • Fixed: Rounded style


  • Added: Show label together with swatches
  • Fixed: Minor CSS/JS issues in the backend


  • Updated: Optimized the code
  • Updated: Compatible with WP 6.5 & Woo 8.8


  • Updated: Compatible with WP 6.4 & Woo 8.7


  • Updated: Compatible with WP 6.4 & Woo 8.5


  • Updated: Compatible with WPC External Variations


  • Added: Term groups
  • Updated: Optimized the code


  • Fixed: Can’t click on term when setting default values


  • Fixed: Minor CSS/JS issues in the backend


  • Added: Stacked layout for swatches on the single product page


  • Added: Parameter ‘hide’ and ‘link’ for shortcode [wpcvs_archive], for example: [wpcvs_archive hide=»pa_size,pa_color» link=»true»]


  • Added: Change the URL on address bar when choosing attribute term


  • Added: Replace product name/price/description on single product page
  • Updated: Optimized the code


  • Fixed: Minor CSS/JS issues in the backend


  • Added: New tooltip library to show attribute’s name, description, image, etc.


  • Fixed: Minor JS issue


  • Fixed: Disable unavailable attribute on the page loaded


  • Fixed: Minor CSS/JS issues in the backend


  • Added: Limit terms for each attribute on archive page


  • Added: Localization tab


  • Fixed: Minor JS issue


  • Updated: Optimized the code


  • Fixed: Error with custom attribute name


  • Added: Compatible with WPC Smart Messages for WooCommerce


  • Added: Function ‘get_settings’ & ‘get_setting’


  • Added: Filter hooks ‘wpcvs_term_class’, ‘wpcvs_term_html’, ‘wpcvs_terms_class’, ‘wpcvs_terms_html’


  • Updated: Optimized the code


  • Fixed: Notice on settings page


  • Updated: Compatible with WordPress 5.9 & WooCommerce 6.4


  • Updated: Optimized the code


  • Updated: Optimized the code


  • Fixed: Attributes ordering


  • Updated: Compatible with WordPress 5.8 & WooCommerce 5.6


  • Fixed: AJAX add-to-cart on archive page


  • Updated: Compatible with WordPress 5.8 & WooCommerce 5.5.2
  • Fixed: Change image when choosing variation


  • Added: Filter hook: wpcvs_archive_atc_text_selector


  • Added: Filter hooks: wpcvs_archive_product_selector, wpcvs_archive_image_selector, wpcvs_archive_atc_selector


  • Added: Product ID for shortcode [wpcvs_archive], e.g [wpcvs_archive id=»99″]


  • Fixed: Change image when choosing variation


  • Added: Enable swatches for shop/ archive page


  • Fixed: Work with other quick view plugins


  • Updated: Compatible with WordPress 5.7 & WooCommerce 5.1


  • Updated: Optimized the code


  • Fixed: Minor JS issue
  • Added: Enable/disable click again to undo the selection on current attribute


  • Added: Radio type


  • Fixed: Some minor CSS issues


  • Added: Square & Rounded style


  • Released