Description
Let your prospects choose product variants in an attractive way!
Instead of drop-down variations, let prospects choose variations in the form of radio buttons with color, text or image swatches.
Simply set the swatches for your desired attributes with the appropriate color, image or labels, and the plugin will do the rest.
Why Use Variation Swatches For WooCommerce?
Along with a user-friendly and easy-to-use interface, this plugin has exclusive features such as:
Auto-Convert Variation Dropdowns To Button Swatch
Variation Swatches For WooCommerce will automatically change the default drop-down display of all product variations into swatches.
No need to manually change for every product one by one.
Set Round or Squared Swatches
You may choose to display variation swatches in Rounded shape or Squared shape.
Types Of Variation Swatches
You can have 3 types of variation swatches:
- Color Variation Swatch
- Image Variation Swatch
- Label Variation Swatch
Color Variation Swatch
A prospect will get a visual of the colors available in the form of radio buttons.
This will help them make accurate selections.
This is a great feature if you have a product with different colors.
Image Variation Swatch
You may present the variations of your variable products in the form of small images to choose from, thus making the prospects’ selection more intuitive.
Label Variation Swatch
Set text labels as swatches on your variable products for your customers to choose from.
This feature is very useful if you have different sizes of the same product, or different materials for the product, or any custom variation factors.
Features:
- Control Product Page Swatches Size
- Choose Swatch shape – Round or Square
- Customize swatch color and background color
- Customize swatch border size and styling
- Variable product quick view pop-up
- Set Tooltip with customized text, size, and background color
- Show cross sign for out of stock variable products
- Enable Disable AJAX variation
Premium Features:
- All the free features
- Variation clear button display settings
- Both rounded and squared swatches on the same product page
- All colors, Image, and button swatches type in the same attribute
Upcoming Features:
- Hide / blur out of stock variation swatches
- Archive page swatches alignment and positioning
- Control swatches size on the shop page
- Multi-color variation swatches
- Tooltip display settings on the archive/shop page
- And many more
How it works?
To start using the plugin, follow the instructions below to use it’s features:
Step 1 –
- Go to Dashboard > Swatches.
- Here, go to the Controls menu on the left.
- Turn on the option ‘Dorpdowns To Button Swatch’
Step 2 –
For existing global attributes
- Go to Dashboard > Products > Attributes.
- Click on an existing attribute name to edit it.
- Here you will find a dropdown selection for Types.
- Choose the Color, Image or Label as you require
- Click on Update.
When adding a new attribute
- Fill out the all the fields
- You will find a dropdown selection for Types.
- Choose the Color, Image or Label as you require
- Click on Add attribute.
Step 3 –
- On the right side of an existing attribute, click on Configure terms.
- When adding a new term, assign Color, text or image below and the Add it.
- For existing term, click on a term to edit it.
- Below, assign Color, text or image below and the Update it.
Privacy Policy
Variation Swatches for WooCommerce uses Appsero SDK to collect some telemetry data upon user’s confirmation. This helps us to troubleshoot problems faster & make product improvements.
Appsero SDK does not gather any data by default. The SDK only starts gathering basic telemetry data when a user allows it via the admin notice. We collect the data to ensure great user experience for all our users.
Integrating Appsero SDK DOES NOT IMMEDIATELY start gathering data, without confirmation from users in any case.
Learn more how Appsero collects and uses this data.
Screenshots
Installation
Automatic installation
Automatic installation is the easiest option as WordPress handles the file transfers itself and you don’t need to leave your web browser.
- Go to Dashboard > Plugins and click on the Add New button at the top.
- In the search field, search for “Variation Swatches for WooCommerce”
- Find the plugin. Install and Activate it.
- Once activated, you will find a new Swatches menu under the Dashboard menus.
Manual Installation
- Download the Variation Swatches for WooCommerce plugin to your desktop.
- Extract the plugin folder to your desktop.
- Read through the “readme” file thoroughly to ensure you follow the installation instructions.
- With your FTP program, upload the Plugin folder to the wp-content/plugins folder in your WordPress directory online.
- Go to Plugins screen and find the “Variation Swatches for WooCommerce” in the list.
- Click Activate to activate it.
CONFIG ATTRIBUTES
Even this plugin has been installed and activated on your site, variable products will still show dropdowns if you’ve not configured product attributes.
- Log in to your WordPress dashboard, navigate to the Products menu and click Attributes.
- Click to attribute name to edit an exists attribute or in the Add New Attribute form you will see the default Type selector.
- Click to that Type selector to change attribute’s type. Besides default options Select and Text, there are more 3 options Color, Image, Label to choose.
- Select the suitable type for your attribute and click Save Change/Add attribute
- Go back to manage attributes screen. Click the cog icon on the right side of attribute to start editing terms.
- Start adding new terms or editing exists terms. There is will be a new option at the end of form that let you choose the color, upload image or type the label for those terms.
FAQ
-
Will this plugin work with my theme?
-
Yes, it will work with any theme, but may require some styling to make it match nicely.
Reviews
Contributors & Developers
“Variation Swatches for WooCommerce” is open source software. The following people have contributed to this plugin.
ContributorsTranslate “Variation Swatches for WooCommerce” into your language.
Interested in development?
Browse the code, check out the SVN repository, or subscribe to the development log by RSS.
Changelog
1.4.1 (25, February 2021)
- Update: Translations
1.4.0 (24, DECEMBER 2020)
- Bug fix: Style issue fixed
- Bug fix: Backend UI issue fixed
- Quick view support added
- WP 5.6 compatible
- WC 4.8.0 compatible
- Translations update
1.3.0 (28, SEPTEMBER 2020)
- Bug fix: delete data when plugins uninstalled
- WP 5.5.1 compatible
- WC 4.5.2 compatible
- Translations update
1.2.0 (11, june 2020)
- WooCommerce 4.2.0 Compatible
- Added: Out of stock product “Crossed” option
1.1.0
- WooCommerce 4.0.0 Compatible
- Image type attribute hover effect added
- Image type attribute selection effect added
1.0.0
- Initial release.