<ul class="wccom-tick-list-primary">
<li>Show product variations as single products in shop, category, and search-result pages.</li>
<li>You can give custom product titles to variations that display as single products in product listing pages.</li>
<li>Includes an option to hide the parent product in shop, category, and search result pages.</li>
<li>You can control the option to show variations as single products and hide parent products globally or on product levels.</li>
</ul>
<hr class="wccom-product-heading__hr" />
<h2>Display Variations on Single Product Pages</h2>
WooCommerce variations display in a drop-down menu on a single product page. The customer must go to the single product page, choose a variation and add it to their cart. For stores that sell products with more variations, showing product variations as single products reduces friction in the purchasing flow. With Variations as Single Products for WooCommerce customers can instantly add multiple variations to their carts. With this plugin, you can save your customers time and improve their browsing experience. You can also hide the parent product from product listing pages.
<h2>Settings</h2>
<ul>
<li>Go to > WooCommerce > Settings > Variations as Products</li>
<li>Enable or disable: Select this checkbox to display variations as single products on product listing pages.</li>
<li>Hide parent products: Select this checkbox to hide parent products on product-listing pages.</li>
<li>Process variations: This button is useful to sync existing variations with the plugin. You will only need to use it once after your initial installation of Variations as Single Products for WooCommerce.</li>
</ul>
<img class="alignnone size-full wp-image-3416272" src="https://woocommerce.com/wp-content/uploads/2021/08/Screenshot-2022-05-13-at-7.20.37-PM.png" alt="" width="980" height="632" /><img class="alignnone size-full wp-image-3416272" src="https://woocommerce.com/wp-content/uploads/2021/08/Screenshot-2022-05-13-at-7.20.37-PM.png" alt="" width="980" height="632" />
<ul>
<li>Go to > Products > Edit product > Single variation</li>
<li>Exclude variations: Select this checkbox to exclude this product and show the variations as single products.</li>
<li>Hide parent product: Select this checkbox to hide the parent product on product listing pages.</li>
</ul>
<img class="alignnone size-full wp-image-3416341" src="https://woocommerce.com/wp-content/uploads/2021/08/admin-product-edit-single-variation.png" alt="" width="980" height="436" />
<ul>
<li>Go to > Products > Edit product > Variation</li>
<li>Variation product name: Input your desired variation product title here.</li>
</ul>
<img class="alignnone size-full wp-image-3416350" src="https://woocommerce.com/wp-content/uploads/2021/08/admin-product-edit-page.png" alt="" width="980" height="1059" />
<h2>Frontend</h2>
<img class="alignnone size-medium wp-image-8487276" src="https://woocommerce.com/wp-content/uploads/2021/08/product-variations-shop-page.png?w=620" alt="" width="620" height="665" />
<h2>Troubleshooting</h2>
Use default WordPress troubleshooting.
<h2>Frequently Asked Questions</h2>
Can I give a custom title to each product variation?
Yes, you can add your custom title to product variations by navigating to Products > Edit product > Variation.
Can I hide parent products?
Yes, you can hide parent products globally or for a specific product. To hide it globally, navigate to WooCommerce > Settings > Variations as Products and select the checkbox “Hide parent product”. To hide it at the product level, navigate to Products > Edit product > Single variation and select the checkbox of “Hide parent product.”
I have installed the plugin and configured it, but the variations are not showing as single products. Any advice?
No worries. You just need to click on the Process Variations button by navigating to WooCommerce > Settings > Variations as Products. This will sync the existing product variations with the plugin. You will only need to use this button after your initial installation.

Variations as Single Products

Display variations on separate, searchable, individual product pages and improve your customers’ experience.

theme funda

Variation Dropdown to Radio Buttons for WooCommerce converts the standard WooCommerce variation <code><select></code> 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.
<blockquote>
⭐ <a href="https://www.codesmade.com/store/variation-dropdown-to-radio-for-woocommerce/" rel="nofollow ugc">Get the Pro Version</a> for advanced layouts, image controls, column grids, and priority support.
</blockquote>
<h4>Why Replace WooCommerce Dropdown Variations?</h4>
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.
<h4>Core Features</h4>
<ul>
<li>Radio Buttons layout — replaces variation dropdowns with styled radio button cards</li>
<li>Switch Box layout — modern card-style layout with image, price, and stock</li>
<li>HTML Select layout — clean, accessible native select element</li>
<li>Select2 layout — searchable, styled dropdown powered by Select2</li>
<li>Show variation image — display variation thumbnail inside each option</li>
<li>Show variation price — surface price differences directly on each button</li>
<li>Show stock availability — display In Stock / Out of Stock per variation</li>
<li>Show variation description — include variation description text beneath each option</li>
<li>Show product title — prepend the parent product name to each variation label</li>
<li>Out-of-stock handling — disable, strikethrough, or hide unavailable variations</li>
<li>Custom variation name — override the label per variation from the product edit screen</li>
<li>Lightweight and fast — scripts and styles load only on single product pages</li>
<li>Zero configuration — works immediately after activation with sensible defaults</li>
<li>Column grid control — set exact column counts for desktop and mobile independently</li>
<li>Image position — place variation image left, above, or below the variation label</li>
<li>Button style options — card, minimal, outlined, and more</li>
<li>Priority email support — direct access to the development team</li>
<li>Early access — first access to new layouts and features</li>
</ul>
<a href="https://www.codesmade.com/store/variation-dropdown-to-radio-for-woocommerce/" rel="nofollow ugc">Upgrade to Pro →</a>
<h4>Documentation & Support</h4>
Full setup guide, screenshots, and developer hooks are available in the <a href="https://www.codesmade.com/variation-dropdown-to-radio-for-woocommerce-documentation/" rel="nofollow ugc">plugin documentation</a>.
For questions, bugs, or feature requests, visit the <a href="https://www.codesmade.com/contact-us/" rel="nofollow ugc">support page</a> or open a thread in the WordPress.org support forum.
<h4>Works With</h4>
<ul>
<li>WooCommerce 5.0 and above</li>
<li>Simple variable products with any number of attributes</li>
<li>All major WooCommerce-compatible themes (Storefront, Flatsome, Astra, Divi, OceanWP, and more)</li>
<li>Page builders: Elementor, WPBakery, Beaver Builder, Gutenberg</li>
</ul>

Variation Dropdown to Radio Buttons for WooCommerce

Replace the default WooCommerce variation dropdown with radio buttons, switch boxes, or a styled Select2 — boosting conversions and user experience on …

Variations as Single Products vs Variation Dropdown to Radio Buttons for WooCommerce