Title: QODE Variation Swatches for WooCommerce
Author: Qode
Published: <strong>25 juni 2024</strong>
Last modified: 23 december 2025

---

Plugins zoeken

![](https://ps.w.org/qode-variation-swatches-for-woocommerce/assets/banner-772x250.
png?rev=3107231)

![](https://ps.w.org/qode-variation-swatches-for-woocommerce/assets/icon-256x256.
png?rev=3107231)

# QODE Variation Swatches for WooCommerce

 Door [Qode](https://profiles.wordpress.org/qodeinteractive/)

[Download](https://downloads.wordpress.org/plugin/qode-variation-swatches-for-woocommerce.1.0.8.zip)

 * [Details](https://nl.wordpress.org/plugins/qode-variation-swatches-for-woocommerce/#description)
 * [Beoordelingen](https://nl.wordpress.org/plugins/qode-variation-swatches-for-woocommerce/#reviews)
 *  [Installatie](https://nl.wordpress.org/plugins/qode-variation-swatches-for-woocommerce/#installation)
 * [Ontwikkeling](https://nl.wordpress.org/plugins/qode-variation-swatches-for-woocommerce/#developers)

 [Ondersteuning](https://wordpress.org/support/plugin/qode-variation-swatches-for-woocommerce/)

## Beschrijving

**QODE Variation Swatches for WooCommerce** provides you with a clear-cut way to
present all your shoppers with **detailed product variations** alongside your products
on shop single pages.

This lets you **reduce the user interaction cost** as well as product viewing & 
comparison times, as you can feature a number of easily adjustable attributes for
your products and more.

[Check out the QODE Variation Swatches Demo](https://qodeinteractive.com/qode-variation-swatches-for-woocommerce/)

[Check out the QODE Variation Swatches documentation](https://qodeinteractive.com/qode-variation-swatches-for-woocommerce/documentation/)

### Basic Features:

 * Create Color attributes
 * Create Image attributes
 * Create Label attributes
 * Adjustable variation styles
 * Custom variation width
 * Custom variation height
 * Custom variation border color
 * Custom size for the space between swatches

### Get Even More with Premium:

 * Dual swatches for two-color samples
 * Custom color codes for selected attributes
 * Create Radio attributes
 * Create Tab Switch attributes
 * Adjustable Image, Color & Label attribute layouts
 * Individual width, height & border color attribute settings
 * Additional selected attribute text
 * Additional Info option for specific attributes
 * Customizable attribute term badges
 * Show or hide specific attributes
 * Adjustable tooltips for attribute terms
 * Modifiable disabled attribute styles
 * Predefined variation styles
 * Generation of links for every variation
 * Choose to show or omit attributes on product pages
 * Max numbers of visible attribute terms in lists
 * AJAX-powered variation data loading on shop pages
 * Customizable “Add to Cart” button
 * Product availability info
 * Show single variations in loops
 * Hide parent products in loops
 * Create new attribute terms
 * Different image galleries for each variation

### Showcase Product Variations in Great Detail Using QODE Variation Swatches

Enhance the eCommerce experience for all your visitors by featuring **product variations**
next to your products with the help of flexible, option-rich QODE Variation Swatches
for WooCommerce plugin.

You can include **color**, **image**, and **label** attribute swatches. The appearance
of each attribute swatch can be modified thanks to a selection of **stylization**
options that the plugin provides.

Best of all, each variation gets displayed **on the fly** once it is clicked on,
providing the potential customer with a quick, streamlined way to view and compare
different **versions of a product** they are viewing on a shop single page, thus
eliminating the need to navigate to a different page on your website in the process.

The plugin is fully optimized for presenting your product variations to **mobile**
users too.

### Customize the Appearance of your Swatches and Attributes

The appearance of each attribute can be **customized** using a clearly outlined 
set of options included with the QODE Variation Swatches for WooCommerce plugin.

You can easily configure **width**, **height**, and idle/active **border colors**
for each of the attributes.

###  Documentation & Support

 * Check out our step-by-step [user guide](https://qodeinteractive.com/qode-variation-swatches-for-woocommerce/documentation/)
   on how to install and use QODE Variation Swatches for WooCommerce.
 * You can also submit a topic to the [support forum](https://wordpress.org/support/plugin/qode-variation-swatches-for-woocommerce/)
   at and our support team will be glad to help you out.

### Privacy Policy

We use our services

Qode’s CDN – The domain https://export.qodethemes.com is a service from which we
retrieve the list of all Qode plugins displayed in the admin dashboard.
 Qode’s 
API – The domain https://api.qodeinteractive.com is an API that’s called when a 
user deactivates the plugin, to retrieve the reason for deactivation. Upon deactivating
the plugin, the users are prompted for a reason for doing so. They also have the
option to deactivate without providing a reply. The data obtained from the users
who respond to the question is collected to improve the plugin. After the analysis
of said data, the plugin is upgraded and enhanced in such a way as to fulfill the
users’ expectations. Qode’s Terms of Use – https://qodeinteractive.com/terms-of-
use/ Qode’s Privacy Policy – https://qodeinteractive.com/privacy-policy/

#### Looking for more?

Feel free to try out some of our other products:

[Qi Theme](https://wordpress.org/themes/qi/)
 [Qi Addons for Elementor](https://wordpress.org/plugins/qi-addons-for-elementor/)
[Qi Blocks for Gutenberg](https://wordpress.org/plugins/qi-blocks/) [QODE Wishlist for WooCommerce](https://wordpress.org/plugins/qode-wishlist-for-woocommerce/)
[QODE Quick View for WooCommerce](https://wordpress.org/plugins/qode-quick-view-for-woocommerce/)
[QODE Compare for WooCommerce](https://wordpress.org/plugins/qode-compare-for-woocommerce/)
[QODE Product Extra Options for WooCommerce](https://wordpress.org/plugins/qode-product-extra-options-for-woocommerce/)
[QODE Product Bundles for WooCommerce](https://wordpress.org/plugins/qode-product-bundles-for-woocommerce/)
[QODE Optimizer](https://wordpress.org/plugins/qode-optimizer/)

## Schermafbeeldingen

[⌊Variation Swatches Demo Part 1.⌉⌊Variation Swatches Demo Part 1.⌉[

Variation Swatches Demo Part 1.

[⌊Variation Swatches Demo Part 2.⌉⌊Variation Swatches Demo Part 2.⌉[

Variation Swatches Demo Part 2.

[⌊Circled Color & Tab Switch.⌉⌊Circled Color & Tab Switch.⌉[

Circled Color & Tab Switch.

[⌊Slider Image & EU/UK Tab Switch.⌉⌊Slider Image & EU/UK Tab Switch.⌉[

Slider Image & EU/UK Tab Switch.

[⌊Three-attribute Variation.⌉⌊Three-attribute Variation.⌉[

Three-attribute Variation.

[⌊Circled Color with Title & Tab Switch.⌉⌊Circled Color with Title & Tab Switch.⌉[

Circled Color with Title & Tab Switch.

[⌊Variation Swatches Global Options.⌉⌊Variation Swatches Global Options.⌉[

Variation Swatches Global Options.

[⌊Admin General Content Options.⌉⌊Admin General Content Options.⌉[

Admin General Content Options.

[⌊Variation Swatches Style Options.⌉⌊Variation Swatches Style Options.⌉[

Variation Swatches Style Options.

## Installatie

From your WordPress dashboard

 1. Go to your WordPress Dashboard -> Plugins -> Add New
 2. Search for QODE Variation Swatches for WooCommerce
 3. Activate QODE Variation Swatches for WooCommerce from your Plugins page.
 4. Enjoy 🙂

From wordpress.org

 1. Download QODE Variation Swatches for WooCommerce.
 2. Upload the qode-variation-swatches-for-woocommerce directory to your ‘/wp-content/
    plugins/’ directory, using your favorite method (ftp, sftp, scp, etc…)
 3. Activate QODE Variation Swatches for WooCommerce from your Plugins page.
 4. Enjoy 🙂

## FAQ

### How do I install QODE Variation Swatches for WooCommerce?

There are two ways you can install QODE Variation Swatches for WooCommerce plugin.

You can install the plugin from your WordPress dashboard:
 1. Navigate to your WordPress
Dashboard -> Plugins -> Add New 2. Search for QODE Variation Swatches for WooCommerce
plugin 3. Install and Activate QODE Variation Swatches for WooCommerce from your
Plugins page.

Or you can install it directly from WordPress.org
 1. Locate and download QODE Variation
Swatches for WooCommerce on wordpress.org 2. Upload the qode-variation-swatches-
for-woocommerce directory to your ‘/wp-content/plugins/’ directory using your preferred
method (ftp, sftp, scp, etc…) 3. Install and Activate QODE Variation Swatches for
WooCommerce plugin from your Plugins page.

## Beoordelingen

![](https://secure.gravatar.com/avatar/f4c21c9042a18e399085dc8f97fbd1bbe0c665b28dea07d7c9b91d29ccf82db6?
s=60&d=retro&r=g)

### 󠀁[Really good plugin](https://wordpress.org/support/topic/really-good-plugin-252/)󠁿

 [markthewalker](https://profiles.wordpress.org/markthewalker/) 3 juli 2024

I've tested most of the new QODE plugins, and I must say I'm impressed. Everything
works very smoothly and doesn't reload the entire variations section like some other
popular variation plugins. Good job.

 [ Lees 1 beoordeling ](https://wordpress.org/support/plugin/qode-variation-swatches-for-woocommerce/reviews/)

## Bijdragers & ontwikkelaars

“QODE Variation Swatches for WooCommerce” is open source software. De volgende personen
hebben bijgedragen aan deze plugin.

Bijdragers

 *   [ Qode ](https://profiles.wordpress.org/qodeinteractive/)

[Vertaal “QODE Variation Swatches for WooCommerce” in je eigen taal.](https://translate.wordpress.org/projects/wp-plugins/qode-variation-swatches-for-woocommerce)

### Interesse in ontwikkeling?

[Bekijk de code](https://plugins.trac.wordpress.org/browser/qode-variation-swatches-for-woocommerce/),
haal de [SVN repository](https://plugins.svn.wordpress.org/qode-variation-swatches-for-woocommerce/)
op, of abonneer je op het [ontwikkellog](https://plugins.trac.wordpress.org/log/qode-variation-swatches-for-woocommerce/)
via [RSS](https://plugins.trac.wordpress.org/log/qode-variation-swatches-for-woocommerce/?limit=100&mode=stop_on_copy&format=rss).

## Changelog

#### 1.0.8 – 29-05-2025

=
 – Fixed showing multiple alerts when no variation has been checked

#### 1.0.7 – 21-01-2025

 * Changed the pro plugin URL to point to the WooCommerce marketplace
 * Fixed problem with ‘Show on list’ option on attributes

#### 1.0.6 – 18-12-2024

 * Improved framework
 * Minor fixes

#### 1.0.5 – 24-10-2024

 * Improved WordPress coding standards
 * Minor fixes

#### 1.0.4 – 14-10-2024

 * Improved framework
 * Minor fixes

#### 1.0.3 – 16-07-2024

 * Improved helper functions
 * Minor fixes

#### 1.0.2 – 04-07-2024

 * Improved framework
 * Fixed minor bugs

#### 1.0.1 – 26-06-2024

 * Improved Taxonomy and Product Attribute framework pages template and style
 * Fixed minor bugs

#### 1.0 – 25-06-2024

 * Initial release.

## Meta

 *  Versie **1.0.8**
 *  Laatst geüpdatet **10 maanden geleden**
 *  Actieve installaties **1.000+**
 *  WordPress versie ** 6.3 of nieuwer **
 *  Getest t/m **6.9.9**
 *  PHP versie ** 7.4 of nieuwer **
 *  Taal
 * [English (US)](https://wordpress.org/plugins/qode-variation-swatches-for-woocommerce/)
 * Tags
 * [product variations](https://nl.wordpress.org/plugins/tags/product-variations/)
   [variation swatches](https://nl.wordpress.org/plugins/tags/variation-swatches/)
   [variations](https://nl.wordpress.org/plugins/tags/variations/)[woocommerce variations](https://nl.wordpress.org/plugins/tags/woocommerce-variations/)
 *  [Geavanceerde weergave](https://nl.wordpress.org/plugins/qode-variation-swatches-for-woocommerce/advanced/)

## Waarderingen

 5 van 5 sterren.

 *  [  1 5 ster beoordeling     ](https://wordpress.org/support/plugin/qode-variation-swatches-for-woocommerce/reviews/?filter=5)
 *  [  0 4 sterren beoordelingen     ](https://wordpress.org/support/plugin/qode-variation-swatches-for-woocommerce/reviews/?filter=4)
 *  [  0 3 sterren beoordelingen     ](https://wordpress.org/support/plugin/qode-variation-swatches-for-woocommerce/reviews/?filter=3)
 *  [  0 2 sterren beoordelingen     ](https://wordpress.org/support/plugin/qode-variation-swatches-for-woocommerce/reviews/?filter=2)
 *  [  0 1 sterren beoordelingen     ](https://wordpress.org/support/plugin/qode-variation-swatches-for-woocommerce/reviews/?filter=1)

[Je beoordeling](https://wordpress.org/support/plugin/qode-variation-swatches-for-woocommerce/reviews/#new-post)

[Bekijk alle beoordelingen](https://wordpress.org/support/plugin/qode-variation-swatches-for-woocommerce/reviews/)

## Bijdragers

 *   [ Qode ](https://profiles.wordpress.org/qodeinteractive/)

## Ondersteuning

Iets te melden? Hulp nodig?

 [Het supportforum bekijken](https://wordpress.org/support/plugin/qode-variation-swatches-for-woocommerce/)