Hướng dẫn thay đổi cách hiển thị giảm giá bắt mắt người xem trong Woocommerce

Code dưới đây giúp bạn thay đổi cách hiển thị giảm giá một cách bắt mắt người xem. Gây ấn tượng và đầy đủ thông tin khách cần biết.

Các bạn chỉ cần thêm đoạn code sau vào functions.php của theme đang kích hoạt là được. Chú ý là code đã bao gồm css nếu không thích dạng này thì các bác tự thay css nha ????

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
/*Sale price by devvn - levantoan.com*/
functiondevvn_price_html($product, $is_variation= false){
    ob_start();
    if($product->is_on_sale()):
        ?>
        <style>
            .devvn_single_price {
                background-color: #199bc42e;
                border: 1px dashed #199bc4;
                padding: 10px;
                border-radius: 3px;
                -moz-border-radius: 3px;
                -webkit-border-radius: 3px;
                margin: 0 0 10px;
                color: #000;
                display: block;
            }
            .devvn_single_price > span{
                display: block;
            }
            .devvn_single_price span.label {
                color: #333;
                font-weight: 400;
                font-size: 14px;
                padding: 0;
                margin: 0;
                float: left;
                width: 82px;
                text-align: left;
                line-height: 18px;
            }
            .devvn_single_price span.devvn_price .amount {
                font-size: 14px;
                font-weight: 700;
                color: #ff3a3a;
            }
            .devvn_single_price span.devvn_price del .amount, .devvn_single_price span.devvn_price del {
                font-size: 14px;
                color: #333;
                font-weight: 400;
            }
        </style>
    <?php
    endif;
    if($product->is_on_sale() && ($is_variation|| $product->is_type('simple') || $product->is_type('external'))) {
        $sale_price= $product->get_sale_price();
        $regular_price= $product->get_regular_price();
        if($regular_price) {
            $sale= round(((floatval($regular_price) - floatval($sale_price)) / floatval($regular_price)) * 100);
            $sale_amout= $regular_price- $sale_price;
            ?>
            <span class="devvn_single_price">
                <span>
                    <span class="label">Giá:</span>
                    <span class="devvn_price"><?php echowc_price($sale_price); ?></span>
                </span>
                <span>
                    <span class="label">Thị trường:</span>
                    <span class="devvn_price"><del><?php echowc_price($regular_price); ?></del></span>
                </span>
                <span>
                    <span class="label">Tiết kiệm:</span>
                    <span class="devvn_price sale_amount"> <?php echowc_price($sale_amout); ?> (<?php echo$sale; ?>%)</span>
                </span>
            </span>
            <?php
        }
    }elseif($product->is_on_sale() && $product->is_type('variable')){
        $prices= $product->get_variation_prices( true );
        if( empty( $prices['price'] ) ) {
            echoapply_filters( 'woocommerce_variable_empty_price_html', '', $product);
        } else{
            $min_price     = current( $prices['price'] );
            $max_price     = end( $prices['price'] );
            $min_reg_price= current( $prices['regular_price'] );
            $max_reg_price= end( $prices['regular_price'] );
            if( $min_price!== $max_price) {
                echowc_format_price_range( $min_price, $max_price) . $product->get_price_suffix();
            } elseif( $product->is_on_sale() && $min_reg_price=== $max_reg_price) {
                $sale= round(((floatval($max_reg_price) - floatval($min_price)) / floatval($max_reg_price)) * 100);
                $sale_amout= $max_reg_price- $min_price;
                ?>
                <span class="devvn_single_price">
                    <span>
                        <span class="label">Giá:</span>
                        <span class="devvn_price"><?php echowc_price($min_price); ?></span>
                    </span>
                    <span>
                        <span class="label">Thị trường:</span>
                        <span class="devvn_price"><del><?php echowc_price($max_reg_price); ?></del></span>
                    </span>
                    <span>
                        <span class="label">Tiết kiệm:</span>
                        <span class="devvn_price sale_amount"> <?php echowc_price($sale_amout); ?> (<?php echo$sale; ?>%)</span>
                    </span>
                </span>
                <?php
            } else{
                echowc_price( $min_price) . $product->get_price_suffix();
            }
        }
    }else{ ?>
        <p class="<?php echo esc_attr( apply_filters( 'woocommerce_product_price_class', 'price' ) );?>"><?php echo$product->get_price_html(); ?></p>
    <?php }
    returnob_get_clean();
}
functionwoocommerce_template_single_price(){
    global$product;
    echodevvn_price_html($product);
}
add_filter('woocommerce_available_variation','devvn_woocommerce_available_variation', 10, 3);
functiondevvn_woocommerce_available_variation($args, $thisC, $variation){
    $old_price_html= $args['price_html'];
    if($old_price_html){
        $args['price_html'] = devvn_price_html($variation, true);
    }
    return$args;
}

Chúc các bạn thành công!

Nguồn: https://levantoan.com