Hiển thị số % chiết khấu cho sản phẩm với plusgin Woocommerce

Cách hiển thị số % chiết khấu cho sản phẩm với plusgin Woocommerce để nhìn cho chuyên nghiệp, Mấy cái button Giảm giá nó dài quá nên nhìn website không có thẩm mỹ cho lắm. Rứa là note lại bài này để mai mốt fix cho dễ.

Hiển thị số % chiết khấu cho sản phẩm với plusgin Woocommerce 

Plusgin có rất nhiều cái để hỗ trợ, khuyến khích xài plusgin trước cho nhanh gọn lẹ hen: Plusgin 1 (Khi cài đặt plugin này bạn kông được tạo thêm hook woocommerce_sale_flash trong file theme functions.php, vì theo thứ tự theme sẽ load sau plugin do đó filter woocommerce_sale_flash cuối cùng sẽ được sử dụng chính là theme.).

--- Cách chèn vào code.
---- Mỗi themes có 1 class riêng nên các bác cứ canh tên của class để edit cho nó phù hợp.

Bài hướng dẫn này thực hiện trên themes FlatSome

Vô file Function.php tại themes Flatsome và thêm đoạn code này

add_filter('woocommerce_sale_flash', 'my_custom_sale_flash', 10, 3);
function my_custom_sale_flash($text, $post, $_product) {
    $from = $_product->regular_price;
    $to = $_product->price;
    if($from==$to || !$to) return '';
    $percent=round(($from-$to)/$from*100);
    $text=$from>$to? '-':'+';
    return '<div class="callout badge badge-circle"><span class="badge-inner secondary on-sale">'.$text.''.$percent.'%</span></div>';
}

Nếu các bác sử dụng themes khác thì có thể tham khảo bài viết này này và này

Chúc các bác thành công.