Often by offering huge discounts on time, sales encourage customers to make quick purchase decisions. If you’re running a WooCommerce website, you know that the default WooCommerce sales badge doesn’t show a discount percentage on most themes. Can easily add discount percentage option to Themes that do not have the Discount Percentage option.
Today I will learn how to change the WooCommerce Sale Badge to Discount Percentage. In the last post, I learned how to Add WooCommerce Auto Update Cart on Quantity Change.
How To Change The WooCommerce Sale Badge To Discount Percentage
You need to add some PHP code to add the Discount Percentage Badge. We can do that by adopting two methods. If your WooCommers site has child themes installed, we can add PHP code to functions.php. Or we can add PHP code using a plugin. The name of the plugin is Code Snippets. A handy plugin, especially for those who do not use child themes. Because if you do not use child themes and add any functions to functions.php if you update the Theme, Will lose all the functions you addedt. For which most people use child themes or code snippets.
Add PHP code functions.php
To add the functions.php code, first, click on Theme Editor from Appearance. Select your child theme from Select theme to edit, then select functions.php and paste the PHP code below all the code and click on update file.

Install Code Snippets Free Plugin
To install the Code Snippets plugin, click Add New from the plugin. In the search bar, type Code Snippets, then click Install and Active.

Add PHP Code In Code Snippets
To add PHP code to the Code Snippets plugin, click Add New from Snippets. First, give a name to the snippets. Paste the PHP code and save and activate. OK, Guys, we have successfully changed the Sale Badge to Discount Percentage.

Sale Badge Percentage PHP Code
add_action( 'woocommerce_sale_flash', 'sale_badge_percentage', 25 );
function sale_badge_percentage() {
global $product;
if ( ! $product->is_on_sale() ) return;
if ( $product->is_type( 'simple' ) ) {
$max_percentage = ( ( $product->get_regular_price() - $product->get_sale_price() ) / $product->get_regular_price() ) * 100;
} elseif ( $product->is_type( 'variable' ) ) {
$max_percentage = 0;
foreach ( $product->get_children() as $child_id ) {
$variation = wc_get_product( $child_id );
$price = $variation->get_regular_price();
$sale = $variation->get_sale_price();
if ( $price != 0 && ! empty( $sale ) ) $percentage = ( $price - $sale ) / $price * 100;
if ( $percentage > $max_percentage ) {
$max_percentage = $percentage;
}
}
}
if ( $max_percentage > 0 ) echo "<span class='onsale'>-" . round($max_percentage) . "%</span>"; // If you would like to show -40% off then add text after % sign
}
You can read our other WordPress posts
- How To Add A Buy Now Button. Send People Directly To Checkout WooCommerce
- How To Add Web Push Notifications To Your Blogger Website Free
- How To Add Dark Mode in WordPress Free Method
- How to Add OTP Based Two Factor Authentication in WordPress for Free
I hope this post will be helpful for you. If you like it, please share the post. If there is any problem, please comment. I will try to solve it.
This post is very useful to me. I was searching on Google for several days and then I found this post. Thanks a lot for the post
That is a good tip especially to those new to the blogosphere.
Short but very accurate information… Thanks for
sharing this one. A must read post!