Beschreibung
Variation Dropdown to Radio Buttons for WooCommerce converts the standard WooCommerce variation <select> dropdown into beautiful, clickable radio buttons, switch boxes, or enhanced select controls — making it easier for customers to browse and choose product variations without hunting through a dropdown list.
Customers can see all available options at a glance, compare prices and stock status side-by-side, and select a variation in one click. The result is a faster, more intuitive shopping experience that reduces friction and increases add-to-cart rates.
⭐ Get the Pro Version for advanced layouts, image controls, column grids, and priority support.
Why Replace WooCommerce Dropdown Variations?
The default WooCommerce dropdown hides all your variation options inside a collapsed select box. Shoppers must click, scroll, and read through a plain list — often missing options entirely. Radio buttons surface every variation immediately, letting customers see images, prices, and stock at a glance before they click.
Studies consistently show that visible product options reduce decision friction and increase conversion rates in e-commerce.
Core Features
- Radio Buttons layout — replaces variation dropdowns with styled radio button cards
- Switch Box layout — modern card-style layout with image, price, and stock
- HTML Select layout — clean, accessible native select element
- Select2 layout — searchable, styled dropdown powered by Select2
- Show variation image — display variation thumbnail inside each option
- Show variation price — surface price differences directly on each button
- Show stock availability — display In Stock / Out of Stock per variation
- Show variation description — include variation description text beneath each option
- Show product title — prepend the parent product name to each variation label
- Out-of-stock handling — disable, strikethrough, or hide unavailable variations
- Custom variation name — override the label per variation from the product edit screen
- Lightweight and fast — scripts and styles load only on single product pages
- Zero configuration — works immediately after activation with sensible defaults
- Column grid control — set exact column counts for desktop and mobile independently
- Image position — place variation image left, above, or below the variation label
- Button style options — card, minimal, outlined, and more
- Priority email support — direct access to the development team
- Early access — first access to new layouts and features
Documentation & Support
Full setup guide, screenshots, and developer hooks are available in the plugin documentation.
For questions, bugs, or feature requests, visit the support page or open a thread in the WordPress.org support forum.
Works With
- WooCommerce 5.0 and above
- Simple variable products with any number of attributes
- All major WooCommerce-compatible themes (Storefront, Flatsome, Astra, Divi, OceanWP, and more)
- Page builders: Elementor, WPBakery, Beaver Builder, Gutenberg
Screenshots

Radio Buttons layout — all variation options displayed as clickable cards with image, price, and stock status 
Switch Box layout — modern switch-style cards with configurable image position 
Select2 layout — searchable, styled dropdown with variation images 
Plugin settings panel — React-powered settings page with General, Appearance, and Display Options sections
Installation
- Upload the
gm-variations-radio-buttons-for-woocommercefolder to/wp-content/plugins/, or install directly from the WordPress plugin directory. - Activate the plugin through the Plugins menu in WordPress.
- Go to GM Radio Buttons in the WordPress admin sidebar.
- Choose your preferred layout (Radio Buttons, Switch Box, HTML Select, or Select2).
- Toggle display options to your preference and click Save Settings.
No additional setup is required. The plugin activates on all variable product pages automatically.
FAQ
-
Does this plugin work with all WooCommerce themes?
-
Yes. The plugin hooks into
woocommerce_before_variations_formand renders its own markup before the native WooCommerce variation form. It is compatible with all standard WooCommerce themes including Storefront, Astra, Flatsome, Divi, OceanWP, and Blocksy. -
Will it slow down my website?
-
No. The plugin’s CSS and JavaScript files are enqueued only on single product pages (
is_product()), so they have zero impact on every other page on your site. -
Can I show a different name for each variation?
-
Yes. Each product variation has a Custom Radio Product Name field added in the variation panel. If filled in, it overrides the auto-generated variation label.
-
What happens to out-of-stock variations?
-
You can choose one of three behaviours in the settings: Disable (greyed out, not selectable), Strikethrough (visible with a strikethrough style), or Hide (removed from the list entirely).
-
Can I control how many columns the variations display in?
-
Column control is available in the Pro version, with separate settings for desktop and mobile breakpoints.
-
Does it support variable products with multiple attributes?
-
Yes. The plugin renders all variation combinations for products with any number of attributes.
-
Is it compatible with WooCommerce High-Performance Order Storage (HPOS)?
-
Yes. The plugin does not interact with the orders table and is fully compatible with HPOS / Custom Order Tables.
-
Where can I find the documentation?
-
Full documentation is at https://www.codesmade.com/variation-dropdown-to-radio-for-woocommerce-documentation/
Rezensionen
Mitwirkende und Entwickler
„Variation Dropdown to Radio Buttons for WooCommerce“ ist Open-Source-Software. Folgende Menschen haben an diesem Plugin mitgewirkt:
MitwirkendeÜbersetze „Variation Dropdown to Radio Buttons for WooCommerce“ in deine Sprache.
Interessiert an der Entwicklung?
Durchstöbere den Code, sieh dir das SVN-Repository an oder abonniere das Entwicklungsprotokoll per RSS.
Änderungsprotokoll
3.0
- Rebuilt settings panel with React — no page reloads, instant save feedback
- Added Switch Box layout with configurable image position (left, top, bottom)
- Added Select2 layout with searchable styled dropdown
- Added out-of-stock action setting: disable, strikethrough, or hide
- Added column grid control for desktop and mobile (Pro)
- Added per-variation custom name field in the product editor
- Removed dependency on
@wordpress/components— all UI components are now custom-built - Light theme for admin settings with Docs, Support, and Upgrade to Pro header links
- REST API endpoints for settings get/save
- Performance: scripts and styles now load only on
is_product()pages
2.0
- Added image display inside radio buttons
- Added price display per variation
- Added stock availability display
- Added variation description display
- General settings panel redesign
1.0
- Initial release — basic dropdown to radio button conversion
