WooCommerce Tips

WooCommerce: Remove “Clear” Button @ Variable Product Page

As soon as you select a product attribute (by default, this is a dropdown right above the variation add to cart button), a “Clear” button appears beside the dropdown/s in order to reset the selection/s and start anew.

As usual, some WooCommerce store owners may require to hide/delete such link, and this is why your truly is here: why “display:none” stuff with CSS when you’re not actually removing it completely from the code? Which means, there must be a PHP way.

And, once again, here comes a 1-line snippet. Enjoy!

When you select an attribute (“Color” in the example), a “Clear” link appears beside the last dropdown. On click, it resets all select fields. In this snippet, we’ll see how to completely remove this element.

PHP Snippet: Remove Reset Variations Link @ Variable Product Page

/**
 * @snippet       Hide Clear Link | WooCommerce Variable Products
 * @how-to        Get CustomizeWoo.com FREE
 * @author        Rodolfo Melogli
 * @compatible    WooCommerce 6
 * @community     https://businessbloomer.com/club/
 */

add_filter( 'woocommerce_reset_variations_link', '__return_empty_string', 9999 );

Where to add custom code?

You should place custom PHP in functions.php and custom CSS in style.css of your child theme: where to place WooCommerce customization?

This code still works, unless you report otherwise. To exclude conflicts, temporarily switch to the Storefront theme, disable all plugins except WooCommerce, and test the snippet again: WooCommerce troubleshooting 101

Related content

  • WooCommerce: Custom Add to Cart URLs – The Ultimate Guide
    In WooCommerce you can add a product to the cart via a custom link. You just need to use the “add-to-cart” URL parameter followed by the product ID. This tutorial will show you how to create custom URLs to add simple, variable and grouped products to the cart – as well as defining the add […]
  • WooCommerce: Add Custom Field to Product Variations
    Adding and displaying custom fields on WooCommerce products is quite simple. For example, you can add a “RRP/MSRP” field to a product, or maybe use ACF and display its value on the single product page. Easy, yes. Unfortunately, the above only applies to “simple” products without variations (or the parent product if it’s a variable […]
  • WooCommerce: Display “FREE” Instead of $0.00 Price
    In older versions of WooCommerce free prices used to display as “FREE!” and products with empty prices were not publishable/purchasable. Now they’ve changed this around, but I still believe “FREE” looks much better than “$0.00”. It’s much more enticing, isn’t it? Well, here’s how you restore the old WooCommerce functionality – as usual it’s as […]
  • WooCommerce: Display Variations’ Stock @ Shop Page
    Thanks to the various requests I get from Business Bloomer fans, this week I’m going to show you a simple PHP snippet to echo the variations’ name and stock quantity on the shop, categories and loop pages. Of course, if “Manage stock” is not enabled at variation level, the quantity will be null, and therefore […]
  • WooCommerce: How to Display Variations with Color / Size Buttons?
    Displaying product pages nicely is the entrepreneur’s dream. Good UX means a much higher probability the interested customer is going to add to cart and complete the checkout. However, WooCommerce variable products come with annoying dropdowns for each attribute (color, size, style, etc. depending on what options you have set up). And as you’ve already […]

Rodolfo Melogli

Business Bloomer Founder

Author, WooCommerce expert and WordCamp speaker, Rodolfo has worked as an independent WooCommerce freelancer since 2011. His goal is to help entrepreneurs and developers overcome their WooCommerce nightmares. Rodolfo loves travelling, chasing tennis & soccer balls and, of course, wood fired oven pizza. Follow @rmelogli

12 thoughts on “WooCommerce: Remove “Clear” Button @ Variable Product Page”

  1. Gavin

    Thanks, for this easy solution, that works for me fine.

    Reply
    1. Rodolfo Melogli

      Great!

      Reply
  2. Eugene

    Thank you! How to remove “Choose an option” from variable product dropdowns in Woocommerce?

    I would like to remove the complete drop-down?

    (the variants should remain in the background and I have always selected the standard variant as the default.)

    Reply
    1. Rodolfo Melogli

      Eugene, thanks so much for your comment! Yes, this is definitely possible, but I’m afraid it’s custom work. If you’d like to get a quote, feel free to contact me here. Thanks a lot for your understanding!

      Reply
  3. Alex Hammerschmied

    Code snippet is still working.
    I love your blog. It’s golden for WooCommerce customization.

    Reply
    1. Rodolfo Melogli

      Cheers

      Reply
  4. Paul

    Hi,
    Is there also a way to show that reset button all the time, even before I select a variation? We have changed the dropdowns to swatches and would like to show that button before we have selected 3 variations. Maybe the user wants to change after selecting two variations, but then the button is not yet showing.

    Reply
    1. Rodolfo Melogli

      I believe you can just use some CSS:

      a.reset_variations {
   visibility: visible !important;
}
      Reply
  5. Arpit Mantri

    Yes it works and clear reset link is not visible but when user selects a variation there is no way to change it as dropdown hides other variations, is there a work around for that to never hide the variation in dropdown?

    Reply
    1. Rodolfo Melogli

      That’s not default WooCommerce behavior, might be a plugin or your current theme hiding the other variations

      Reply
  6. Judith

    Works like a charm!

    Reply
    1. Rodolfo Melogli

      Great!

      Reply
Questions? Feedback? Customization? Leave your comment now!
_____

If you are writing code, please wrap it like so: [php]code_here[/php]. Failure to complying with this, as well as going off topic or not using the English language will result in comment disapproval. You should expect a reply in about 2 weeks - this is a popular blog but I need to get paid work done first. Please consider joining the Business Bloomer Club to get quick WooCommerce support. Thank you!

Your email address will not be published. Required fields are marked *