Hiển thị số lượng sản phẩm đã bán trong wordpress ( woo )

Bằng cách hiển thị số lượng sản phẩm đã bán trong wordpress với woocommerce không cần dùng plugin giúp tạo sự tin tưởng của khách hàng. Thúc đẩy niềm tin và mua hàng trên web cho bạn. Bài hôm nay giúp bạn hiển thị số lượng sản phẩm đã bán trong shop woocommerce.





Bước 1: mở file functions.php. Kéo xuống dưới cuối. Thêm đoạn code sau vào file functions.php và lưu lại. Lưu ý: khi bạn update theme wrodpress. Đoạn code hiển thị số lượng sản phẩm đã bán trong wordpress sẽ mất! Phải thêm thủ công lại nhé.

Mã:

/**
* hien thi so san pham da ban trong woo
*/
add_action( 'woocommerce_single_product_summary', 'hocwordpress_product_sold_count', 11 );

function hocwordpress_product_sold_count() {
global $product;
$units_sold = $product->get_total_sales();
if ( $units_sold ){?>
<div class="product-sales epic_box">
<div id="progressbar"><div>
<?php
echo '' . sprintf( __( 'Đã bán: %s', 'woocommerce' ), $units_sold ) . '';
?>
</div></div>
<style>#progressbar {
  background-color: #ffa9a9;
  border-radius: 13px;
}
#progressbar>div {
  background-color: red;color: #fff;
  width: 40%;
  border-radius: 10px;padding: 0px 10px;
}
.epic_box {
padding-top: 5px;
padding: 5px;
border-radius: 8px;
margin-bottom:10px;
}
.product-sales{
font-size:15px;
font-weight:600;
}
.product-sales .fa{
margin-right:10px;
}   
    </style>
</div><?php
}
}

Bước 2: Mở sản phẩm bạn đã đăng trong woocommerce. Chọn vào menu "Tùy chọn hiển thị" ( phía trên, bên phải màn hình ). Thích chọn "Trường tùy biến" để hiển thị các trường tùy biến của woocommerce.




Bước 3: Chú ý dòng total_sales . Điền vào con số bạn muốn hiển thị. Ví dụ muốn hiển thị đã bán 805 sản phẩm. Bạn điền vào số 805. Lưu lại và tận hưởng





Nếu muốn thay đổi độ dài của thanh màu đỏ nền. Tìm đến đoạn progressbar>div trong code ở bước 1. Thay thông số width: 40% thành thông số của bạn mong muốn.

Kết thúc!