MBTech Variant Swatches for WooCommerce
·
Transform WooCommerce variation dropdowns into beautiful color, image, label, checkbox, and enhanced dropdown swatches with drag-and-drop sorting.
MBTech Variant Swatches for WooCommerce replaces the default WooCommerce variation dropdown selects with visually rich swatches, giving your customers a more intuitive and engaging product selection experience.
Features
- Color Swatches — Display product variations as colored circles or squares with a hex color picker.
- Image Swatches — Show variation images using the WordPress Media Library.
- Label/Button Swatches — Display text-based buttons for sizes, materials, etc.
- Checkbox Swatches — Styled checkbox/radio UI for variation selection.
- Enhanced Dropdown — Improved select dropdown with color/image previews.
- Drag & Drop Sorting — Reorder swatch display order per product.
- Per-Product Overrides — Override global swatch type on individual products.
- Out of Stock Control — Cross out, blur, or hide unavailable variations.
- Tooltips — Hover tooltips for color and image swatches.
- Responsive & Accessible — Mobile-friendly, keyboard navigable, ARIA attributes.
- Theme Override Support — Theme developers can override swatch templates.
- HPOS Compatible — Fully compatible with WooCommerce High-Performance Order Storage.
How It Works
- Go to Products → Attributes and edit an attribute (e.g., Color).
- Choose a Swatch Type (Color, Image, Label, Checkbox, or Dropdown).
- Edit individual attribute terms to set their color, image, or label.
- Swatches automatically replace the default dropdown on the product page.
Requirements
- WordPress 6.0 or higher
- WooCommerce 7.0 or higher
- PHP 7.4 or higher