
外掛標籤
開發者團隊
② 後台搜尋「Sayan Variation Swatches for WooCommerce」→ 直接安裝(推薦)
原文外掛簡介
Variation Swatches for WooCommerce replaces the default dropdown-based variation selectors with visually rich swatches such as colors, images, labels, and radio buttons. It improves product browsing experience by making variation selection faster, clearer, and more user-friendly for customers.
This plugin is built for performance, simplicity, and compatibility with modern WooCommerce stores.
📖 = View Documentation =
WooCommerce Swatches Features
Color swatches (solid and dual/split colors)
Image swatches for visual product variations
Label / Button swatches (S, M, L, XL, etc.)
Radio-style variation selectors
Advanced Variation Features
Dual/split color support for multi-tone products
Automatic variation image switching on selection
No page reload required for image updates
Swatches on product, shop, and category pages
Out-of-stock display control (blur, cross, or hide)
Design & Customization
Square, rounded, and circle swatch shapes
Custom swatch size control for product and archive pages
Tooltip support with customizable colors
Selected state indicator with customizable styling
Custom CSS support from settings panel
Shop & Archive Enhancements
Show variation swatches directly on shop and category pages, allowing customers to preview product options without opening product pages.
Accessibility
Built with accessibility in mind:
ARIA roles for swatches
Keyboard navigation support (arrow keys, Enter, Space, Escape)
Screen reader friendly structure
Performance & Compatibility
Lightweight and optimized structure
No unnecessary AJAX requests
Fully compatible with WooCommerce HPOS
Compatible with WooCommerce Cart and Checkout Blocks
Works with most WooCommerce themes including Astra, Flatsome, OceanWP, Storefront, and Divi
Perfect For
Fashion and clothing stores
Furniture and home decor shops
Cosmetic and beauty products
Any WooCommerce variable product store
How It Works
Install and activate the plugin
Go to Products → Attributes
Edit an attribute term
Choose swatch type (color, image, label, radio)
Assign values and save
Swatches automatically appear on product pages
Variation Image Switching
When a customer selects a swatch, the corresponding product variation image is automatically displayed without page reload. This provides a smoother and more interactive shopping experience.
Frequently Asked Questions
Does this work with all WooCommerce themes?
Yes. The plugin uses standard WooCommerce hooks and works with most modern WooCommerce themes.
Can I assign different swatches per product?
Yes. You can set global swatches per attribute and override them per product if needed.
Does it support custom attributes?
Yes. Both global and custom product attributes can be used for swatches.
What happens with out-of-stock variations?
You can choose to blur, mark, or hide out-of-stock swatches from settings.
Is it translation ready?
Yes. The plugin is fully translation ready and compatible with multilingual plugins.
Screenshots
Product page with variation swatches
Plugin settings panel
Design customization options
Changelog
1.0.2
Fixed: saving settings on one tab (e.g. General) was resetting settings on other tabs (Design, Archive, Advanced) back to their defaults. Each tab now saves independently without affecting the others.
1.0.1
Added compatibility guard so the plugin can run safely alongside Sayan Variation Swatches Pro without function/class redeclaration conflicts.
1.0.0
Initial release
