How Do I Show Percentage or Save Amount for WooCommerce Product Sale?

When you are offering a sale on your WooCommerce products, you may want to show the percentage or amount of money that the customer will save. This can be done by using the following code:

To Show the Percentage Saved:

Replace “XX” with the percentage off that you want to display on your product pages. For example, if you want to show that a product is 20% off, you would replace “XX” with “20”.

• For Single Product Pages:

add_action( 'woocommerce_single_product_summary', 'percentage_saved_message', 31 );
function percentage_saved_message() {
$percentage = XX; // Replace XX with your percentage
echo '<div class="percentage-saved">';
echo sprintf( __('Save %s', 'woocommerce' ), $percentage . '%' );
echo '</div>';

• For Shop & Archive Pages:

add_action( 'woocommerce_after_shop_loop_item_title', 'percentage_saved_message', 11 );

To Show the Amount Saved:

• For Single Product Pages:

add_action( 'woocommerce_single_product_summary', 'amount_saved_message', 31 );

function amount_saved_message() {
global $product;
$price = $product->get_regular_price();
$sale = $product->get_sale_price();
if ( $price && $sale ) {
$saving = $price - $sale;
$percentage = round(( $saving / $price ) * 100);
echo '<div class="amount-saved">';
echo sprintf( __('Save %s', 'woocommerce' ), wc_price($saving) );
if ( $percentage ) {
echo sprintf( __('(%s%%)', 'woocommerce' ), $percentage );
}
echo '</div>';
}
}

• For Shop & Archive Pages:

add_action( 'woocommerce_after_shop_loop_item_title', 'amount_saved_message', 11 );

function amount_saved_message(){
global $product;
if ($product->is_on_sale()){
if (isset($product->regular_price) && isset ($product->sale_price)){
$regularPrice = apply_filters( 'raw_woocommerce_price', $product->regular_price );
$salePrice=apply_filters( 'raw_woocommerce_price', $product->sale_price );
if ($regularPrice !==$salePrice){
echo "<span class='amount-saved'>";
echo sprintf (__("Save %s",'woocommerce'),wc_price($regularPrice-$salePrice));
if ($product->is_percent_discount()){
echo sprintf (__("(%d%%)",'woocommerce'),100-$product->get_percent_discount());
}
echo "</span >";
}
}
}
}

Conclusion: How Do I Show Percentage or Save Amount for WooCommerce Product Sale?

By using the code provided in this article, you can display either the percentage or amount saved when a customer purchases a product on sale. This can be done on both single product pages and shop & archive pages.