I have been working on a WooCommerce site and recently updated the plugin to the latest version. At the time of this writing that was release v2.0.10. None of my products have a price since the client is not ready to sell just yet. Prior to this update, there were no “Sale!” icons appearing in my cart. After the update, they appear:

WooCommerce Sale Icon on Every Category

You can see there is a WooCommerce “Sale” icon/badge on every product category. This doesn’t look very good and the client was like WTH man! Here’s what I did to remove them.

Method 1: Filter the “Sale” Icon Out Completely

The following is a simple filter I created to return false; when WooCommerce calls for the Sale badge:

Place this bad boy in your custom functions plugin or theme’s function.php file and you should see the Sale icon disappear.

No more sale icon

Now, that’s better! I’m sure the filter above could be modified to conditionally remove the Sale icon.

Method 2: Unhook the Before Single Product Action

This method works in removing the WooCommerce sales flash. I suggest using this only if the method above isn’t working for some reason. I say this because removing the action completely may break another plugin’s functionality if it ties into this action. Thanks to BrakeConnect in the comments for the following code.


If this has helped you or your situation is slightly different please tell is in the comments below!

Devin Walker is a San Diego-based WordPress Developer and enthusiast. He is the author of several popular and highly-rated WordPress themes and plugins. In his free time he enjoys playing Golf and traveling.

Follow Devin:

43 Responses to “How to Remove Product Sales Flash Icon Badge in WooCommerce”

  1. Yacine Baroudi

    Thank you Sir! That badge was driving me nuts!

    Reply
  2. Vendy Xiao

    I just wondering can you modify the template so it will show out of stock badge like sale badge above when the product is out of stock?

    Reply
    • Devin Walker

      I have not heard of this functionality but I’m positive it is possible… whether or not it is included by default, I am unsure.

      Reply
  3. baklavoni

    great! worked like a charm!
    Thanks!!!

    Reply
  4. Tim Griffin

    Thanks for posting this.
    Inspired some further investigation resulting in a quick way to utilize the Sales Item Flash even further.
    If you want to customize the sales flash message try this:

    //Change Sale Flash to Custom Text
    add_filter( ‘woocommerce_sale_flash’, ‘le_custom_woocommerce_sale_flash’ );
    function le_custom_woocommerce_sale_flash() {
    return ‘‘.__(‘Spotlight Item!’, ‘woocommerce’).’‘;
    }

    Reply
  5. Ryan

    L-IFE SAVER! Had to do this in front of a client – took 2 seconds with this bad boy

    Reply
  6. Jeff

    You can also just set the sale times for each item as a past date, then the sale goes away and they won’t reappear because the sale “already happened”. I work in a store where we may have sales in the future, so this was the best solution for us.

    Reply
  7. cassy

    Hey, I’m new at HTML and all these things… where should I put the code? I tried on the CSS box o my theme settings, but it does not work. Can you help me please 🙂 ?

    Reply
  8. Toni

    I put this in my function.php on my wordpress and it appears me an error 500 and now i can’t do anything, someone can help me?

    Reply
  9. BrakeConnect

    You can also just unhook it by putting this line in your theme functions.php file

    remove_action( ‘woocommerce_before_single_product_summary’, ‘woocommerce_show_product_sale_flash’ , 10);

    Reply
  10. Tony

    Thanks for the code, took away some stress!

    Reply
  11. DD

    How can i hide “New” badge, “Sale” badge when displaying “Sold out” badge

    Reply
  12. aleks

    Thanks for the code, it was helpful.

    Reply
  13. Pradeep

    hi, can we edit the word ‘Sale’ to Discount?.. I think that sounds better to my products..

    Reply
  14. else

    Sorry, but in wich file do I add this? 🙂

    Reply
  15. Ana

    thank you a million times! that icon is indeed horrible

    Reply
  16. srinivas

    hi it s removing only sale text. Not removing circle icon with back ground color

    Reply
  17. Michael Herchenroder

    I had to slightly modify the filter and return an empty string instead of false:

    add_filter(‘woocommerce_sale_flash’, ‘my_woocommerce_sale_flash’, 10, 3);

    function my_woocommerce_sale_flash($flash, $post, $product){
    $options = get_option( ‘my_options’ );
    if($options[‘show_sale_flash’] == 1){
    return $flash;
    }else{
    return ”;
    }

    }

    But I wouldn’t have gotten this far without your post, so thanks!

    Reply
  18. Dave Pemberton-Smith

    I added this bit of code and have since removed it. The problem is it is showing at the bottom of my website on the front end. Can you offer any way that I can remove it?

    Reply
  19. Anna

    Great! Thanks a lot 🙂

    Reply
  20. Virginia

    Worked like a charm on Virtue WordPress theme.
    Great. Huhh! 😀

    Reply
  21. Nino

    Is it possible to make this icon navigate to custom link?

    Reply
  22. David Andora

    Exactly what I was looking for, thank you! It’s however not working for WooCommerce Simple Auction product type auction icon. Any thoughts?

    Reply
    • Devin Walker

      I’m not sure how the icon is hooked in with that extension. I’d have to look at the code…

      Reply
      • David Andora

        Thank you. This is what I received from Simple Auction support: If you want to remove this, you need to copy all files from plugin_dir/templates to your_theme/woocommerce and then edit file your_theme/woocommerce/loop/auction-bage.php and comment out all code there. I’m not exactly sure what the last part of this means. Does this help at all?

        Reply
        • Devin Walker

          Yeah, he’s saying just copy the plugin’s template file to your theme and remove this code displaying the badge. This will ensure you are compatible with updates as you are not modifying the core plugin files.

          Reply
  23. Shahid

    How do I show sale circle/balloon instead of sale button. I am using storefront free child theme. Thanks

    Reply
  24. MdAzeem

    Woah!! Thanks mannn

    Reply
  25. DanMan

    tried adding this to the function.php file and this is what it did. Any suggestions on a fix? http://jlipco.com/

    Reply
    • DanMan

      it shows the same thing when I try to loggin to back end too so not sure even where to start

      Reply
  26. Joseph

    Method 1 worked for me. You are the man!

    Reply
  27. Marc Shade

    Custom CSS method…

    .onsale {
    display: none;
    }

    Reply

Leave a Reply