Change the WooCommerce Sale Badge to Discount Percentage

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. Discount Percentage options can be easily added 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 very useful 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, all the functions that you added will be lost. 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.

Change the WooCommerce Sale Badge to Discount Percentage
Add PHP code functions.php

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.

Change WooCommerce Sale Badge to Discount Percentage 3
Install Code Snippets Free Plugin

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.

Change WooCommerce Sale Badge to Discount Percentage 4
Add PHP Code In Code Snippets

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

I hope this post will be useful for you. If you like it, please share the post. If there is any problem, please comment. I will try to solve it.

Share your love
Default image
SM.Tanvir Hassan
I love technology and love to learn. This is my personal blog. I share with you everything I learn through this blog
Articles: 19

Newsletter Updates

Enter your email address below to subscribe to our newsletter

One comment

Leave a Reply

Thanks for choosing to leave a comment. Please keep in mind that all comments are moderated according to our comment policy, and your email address will NOT be published. Please Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.