Show "You Save" Amount on Sale Products
Adds a line under the price of products on sale that tells shoppers how much they save, for example "You save $15.00 (25%)".
Opens WPIDE on
Code
add_filter( 'woocommerce_get_price_html', function ( $html, $product ) {
if ( is_admin() || ! $product instanceof WC_Product || ! $product->is_on_sale() || $product->is_type( array( 'variable', 'grouped' ) ) ) {
return $html;
}
$regular = (float) wc_get_price_to_display( $product, array( 'price' => $product->get_regular_price() ) );
$sale = (float) wc_get_price_to_display( $product, array( 'price' => $product->get_sale_price() ) );
if ( $regular <= 0 || $sale >= $regular ) {
return $html;
}
$saving = $regular - $sale;
$percent = round( $saving / $regular * 100 );
return $html . sprintf( '<span class="wpide-you-save" style="display:block;font-size:.85em;color:#008a20;">You save %s (%d%%)</span>', wc_price( $saving ), $percent );
}, 20, 2 );
add_filter( 'woocommerce_available_variation', function ( $data, $parent, $variation ) {
if ( $variation->is_on_sale() && (float) $data['display_regular_price'] > (float) $data['display_price'] ) {
$saving = (float) $data['display_regular_price'] - (float) $data['display_price'];
$data['price_html'] .= sprintf( '<span class="wpide-you-save" style="display:block;font-size:.85em;color:#008a20;">You save %s</span>', wc_price( $saving ) );
}
return $data;
}, 10, 3 );
Notes
Works for simple products; variable products show the saving once a variation is selected.
How to add this snippet
- Install WPIDE on your WordPress site (it is free) and open Code Snippets.
- Use snippet above adds it from the library in one click. Or copy the code into a new snippet with the same code type.
- It is added inactive: review the code and settings, then switch it on.