Woocommerce ngày nay đang là plugin miễn phí hỗ trợ khiến cho website bán hàng trên WordPress rất rộng rãi. Ở bài viết này AN NHIÊN sẽ chỉ dẫn các bạn hiển thị số lượng sản phẩm đã bán trong Woocommerce. Bây giờ, cùng theo dõi và làm theo mình nhé.
Hiển thị số lượng sản phẩm đã bán trong Woocommerce
Các bạn làm theo 3 bước sau cũng tương tự như:
Lấy danh mục con trong danh mục sản phẩm
CÓ THỂ BẠN QUAN TÂM
Các bài viết về theme Flatsome Wordpess
- Bước 1: Các bạn đăng nhập vào trang quản trị của website.
- Bước 2: Vào mục Giao diện → Sửa giao diện → function.php.
- Bước 3: Sau đó các bạn thêm đoạn code bên dưới vào function.php.
Trường hợp 1 : Nếu bạn muốn nó hiện ở trang sản phẩm thì dùng đoàn code này:
add_action( ‘woocommerce_single_product_summary’, ‘wc_product_sold_count’, 11 );
function wc_product_sold_count()
global $product;
$units_sold = get_post_meta( $product->get_id(), ‘total_sales’, true );
echo ‘<p class=”da-ban”>’ . Sprintf( __( ‘Đã bán: %s’, ‘woocommerce’ ), $units_sold ) . ‘≪/p>’;
Trường hợp 2 : Nếu bạn muốn hiển thị ở trang chủ thì bạn dùng code:
add_action( ‘woocommerce_after_shop_loop_item_title’, ‘wc_product_sold_count’ );
function wc_product_sold_count()
global $product;
$units_sold = get_post_meta( $product->get_id(), ‘total_sales’, true );
echo ‘<p class=”da-ban”>’ . Sprintf( __( ‘Đã bán: %s’, ‘woocommerce’ ), $units_sold ) . ‘≪/p>’;
Trường hợp 3 : Nếu bạn muốn hiển thị ở cả 2 vị trí thì các bạn dùng code này nhé:
add_action( ‘woocommerce_after_shop_loop_item_title’, ‘wc_product_sold_count’ );
add_action( ‘woocommerce_single_product_summary’, ‘wc_product_sold_count’, 11 );
function wc_product_sold_count()
global $product;
$units_sold = get_post_meta( $product->get_id(), ‘total_sales’, true );
echo ‘<p class=”da-ban”>’ . Sprintf( __( ‘Đã bán: %s’, ‘woocommerce’ ), $units_sold ) . ‘≪/p>’;
Thế là đã ok rồi nhé các bạn, muốn đẹp hơn thì các bạn css thêm dòng code này vào nhé:
p.da-ban
border-radius: 20px;
margin-bottom: 0;
text-align: center;
margin-top: 5px;
background-color: rgba(210,33,33,.4);
background-image: none;
margin-left: 10px;
margin-right: 10px;
position: relative;
height: 25px;
margin-bottom: 10px;
color: #fff;
-webkit-box-shadow: none;
box-shadow: none;
Lưu ý: Ở đây mình đặt class là da-ban, name class của các bạn sở hữu thể khác nhé.
Cảm ơn các bạn đã đọc bài viết này! Like nếu bạn cảm thấy nó có ích.
Xin chân thành cảm ơn! Chúc các bạn thành công.
