Code hiển thị phần trăm giảm giá của sản phẩm

Bạn muốn hiển thị phần trăm giảm giá % discount của sản phẩm? Mình giới thiệu đến bạn một số đoạn code dưới đây để bạn tham khảo. Lưu ý đây chỉ mới là đoạn code PHP, việc tùy chỉnh về màu sắc, size chữ cần bổ sung thêm code CSS nhé bạn.

Ủng hộ mình bằng cách click vào 1-2 quảng cáo bất kỳ trên website nhé. Cảm ơn bạn nhiều nhiều.
No Code Building – Admin

Nếu bạn chưa biết cách chèn code PHP vào website WordPress, mời bạn đọc bài viết Cách chèn code PHP vào website.

Hiển thị phần trăm giảm giá giữa Giá niêm yết và Giá khuyến mãi (Display percentage discount between Regular Price and Sale Price)

Đoạn code này sẽ hiển thị phần trăm giảm giá giữa Giá niêm yết và Giá khuyến mãi của sản phẩm.

Đoạn code này áp dụng cho hook woocommerce_format_sale_price

Lưu ý khi sử dụng đoạn code này:

Mình có chèn thêm điều kiện là chỉ hiển thị % discount ở Single Product page và Cart page. Ở các phần còn lại ví dụ như ở Product Categories, sẽ không hiển thị % discount. Bạn có thể so sánh giữa hai phần if và else để tùy chỉnh.
Mình có đặt kèm một số class trong code để các bạn có thể ẩn đi bằng CSS display:none ở các khu vực tùy chọn.
Code này sẽ thay đổi $price thành biến mới bao gồm Giá niêm yết, Phần trăm giảm giá, Giá khuyến mãi. Các bạn muốn tách rời có thể tham khảo đoạn code thứ hai.

function add_discount_woocommerce_format_sale_price( $price, $regular_price, $sale_price ){
    if ( is_single()||is_cart() ) :
	$percentage = round( ( $regular_price - $sale_price ) / $regular_price * 100 ).'%';
   	$price = '<del>' . ( is_numeric( $regular_price ) ? wc_price( $regular_price ) : $regular_price ) . '</del><br class="xuongdong"><sup class="phantramgiamgia">' .  __( ' Giảm: ' ) .$percentage. '</sup> <br><ins>' . ( is_numeric( $sale_price ) ? wc_price( $sale_price ) : $sale_price ) . '</ins>';
	
	else:
	$price = '<del>' . ( is_numeric( $regular_price ) ? wc_price( $regular_price ) : $regular_price ) . '</del><br><ins>' . ( is_numeric( $sale_price ) ? wc_price( $sale_price ) : $sale_price ) . '</ins>';
	endif;
    return $price;
	
	
	
}
add_filter( 'woocommerce_format_sale_price', 'add_discount_woocommerce_format_sale_price', 99, 3 );

Kết quả sau khi thêm CSS sẽ như hình dưới:

Bạn nào muốn thêm chữ Giá niêm yết và Giá khuyến mãi ở trước phần giá thì tham khảo bài:

Code chèn thêm chữ vào trước giá sản phẩm (Insert text before price of product Woocommerce)

Bạn nào muốn tách rời Giá sản phẩm và Phần trăm giảm giá thành 2 phần riêng biệt thì tham khảo đoạn code thứ hai sau đây.

Hiển thị Phần trăm giảm giá sau Giá sản phẩm

add_filter( 'woocommerce_get_price_html', 'change_displayed_sale_price_html', 10, 2 );
function change_displayed_sale_price_html( $price, $product ) {
    // Only on sale products on frontend and excluding min/max price on variable products
    if( $product->is_on_sale() && ! is_admin() && ! $product->is_type('variable')){
        // Get product prices
        $regular_price = (float) $product->get_regular_price(); // Regular price
        $sale_price = (float) $product->get_price(); // Active price (the "Sale price" when on-sale)

        // "Saving Percentage" calculation and formatting
        $precision = 1; // Max number of decimals
        $saving_percentage = round( 100 - ( $sale_price / $regular_price * 100 ), 1 ) . '%';

        // Append to the formated html price
        $price .= sprintf( __('<p class="saved-sale">Save: %s</p>', 'woocommerce' ), $saving_percentage );
    }
    return $price;
}

Đoạn code này chèn vào hook woocommerce_get_price_html

Đoạn code thứ hai sẽ tách Phần trăm giảm giá thành class saved-sale riêng biệt. Bạn có thể tùy biến dễ dàng hơn. Theo đoạn code thứ hai, giá sản phẩm lúc này sẽ thành 2 phần gồm phần một = (Giá niêm yết + Giá khuyến mãi) và phần 2 = (Phần trăm giảm giá).

Hiển thị Phần trăm giảm giá trên hình sản phẩm

Đoạn code thứ ba sẽ hiển thị Phần trăm giảm giá trên ảnh đại diện của sản phẩm.

Đoạn code này chèn vào hook woocommerce_sale_flash và có nội dung như sau:

function woocommerce_custom_sale_savings() {
   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 ) {
     return  '<span class="onsale">-' . round($max_percentage) . '%</span>';
   } 
	}

add_filter('woocommerce_sale_flash', 'woocommerce_custom_sale_savings', 10, 3);

Cảm ơn bạn đã theo dõi bài viết.