How to Display Custom Badges in WooCommerce

Display custom WooCommerce product badges. This is the best example to learn custom product badges to make your store more sales and increase visibility.

Want to change the text?

Paste the following code in the function.php file of your activated website theme :

add_filter( 'woocommerce_sale_flash', 'wc_custom_replace_sale_button' );
function wc_custom_replace_sale_button( $html ) {
	return str_replace( __( 'Sale!', 'woocommerce' ), __( 'Sale', 'woocommerce' ), $html );
}

Want to change the look?

Paste the following code in the style.css file of your activated website theme :

span.onsale {
text-align: center;
width: 100px;
height: auto;
background: red;
color: black;
border-radius: 10%;
-moz-border-radius: 10%;
-webkit-border-radius: 10%;
}

Want to remove the ‘Sale’ badge completely?

In that case, you can just simply remove the ‘Sale’ badge.
Copy paste the following code in your function.php file.

add_filter('woocommerce_sale_flash', 'woo_custom_sales_button_remove');
function woo_custom_sales_button_remove() { 
	return false;
}