Replace dropdown selectors with visual color, image, and label swatches for WooCommerce product variations
WooCommerce Variation Swatches Pro
WooCommerce Variation Swatches Pro replaces standard variation dropdown menus with visual swatch selectors. It supports color swatches, image swatches, and label/button swatches for product attributes, improving the product selection experience on WooCommerce stores.
Included with purchase:
- 100% GPL Licensed
- Lifetime Updates
- Technical Support
- Instant Download
What is WooCommerce Variation Swatches Pro?
WooCommerce Variation Swatches Pro is a WooCommerce plugin that replaces standard variation dropdown menus with visual swatch selectors including color swatches, image thumbnails, and label buttons for product attributes, with customizable styling, tooltip support, and shop page integration for improved product variation selection experience.
Key Features
Color Swatches
Display product color attributes as visual colored circles or squares for intuitive selection.
Image Swatches
Show product images or pattern thumbnails as selectable swatch options for visual attributes.
Label/Button Swatches
Present text attributes like sizes as styled clickable buttons replacing dropdown menus.
Shop Page Integration
Display variation swatches on product listing pages for quick selection without visiting detail pages.
Customizable Styling
Configure swatch size, shape, borders, selected states, and out-of-stock appearance settings.
Hover Tooltips
Show attribute names, enlarged images, or custom text when customers hover over swatches.
Who is this for?
Pros
- Visual swatches make product variation selection more intuitive than text dropdowns
- Multiple swatch types (color, image, label) suit different attribute categories
- Shop page swatch display enables quick variation selection from product listings
- Customizable swatch sizing, shapes, and styling match store design aesthetics
- Tooltip support provides additional context for small or ambiguous swatches
Cons
- •Requires initial setup time to configure swatch types and assign visual representations per attribute
- •Stores with many product variations may need significant swatch asset creation for image swatches
Product Description
WooCommerce Variation Swatches Pro transforms the default WooCommerce variation dropdown menus into visual swatch selectors. Instead of text-only dropdown lists for attributes like color, size, and material, customers interact with visual elements that make product selection more intuitive and engaging.
Swatch Types
The plugin supports multiple swatch presentation styles, each suited to different attribute types. You can mix swatch types within a single product to match the nature of each attribute — colors shown as colored circles, sizes as text labels, and patterns as image thumbnails.
Visual Options
- Color swatches — display attributes as colored circles or squares matching the actual product color
- Image swatches — show product images or pattern thumbnails as selectable options
- Label swatches — present text labels as clickable buttons with customizable styling
- Radio buttons — offer radio-style selectors as an alternative to dropdowns
Product Page Integration
Swatches replace dropdowns on individual product pages and can also appear on shop/category pages for quick attribute selection without visiting the product detail page. This enables add-to-cart actions directly from product listing pages.
Styling & Customization
Configure swatch size, shape (circle, square, rounded), border styles, selected state appearance, and out-of-stock display behavior. Disabled or unavailable variations can be shown as crossed out, dimmed, or hidden based on your preference.
Tooltip Support
Add hover tooltips to swatches showing attribute names, enlarged images, or custom text. Tooltips provide additional context for small swatches, helping customers make informed selections without additional clicks.
Our Verdict
PluginTheme Team
Expert Reviewer
A practical improvement for WooCommerce stores selling variable products. The visual difference between dropdown menus and swatches is noticeable, and the implementation is straightforward for common attribute types.
