Active License Elementor Pro chỉ với 300k/năm/domain Shop Now
Mới Dịch vụ thiết kế website, xử lý mã độc & tối ưu tốc độ chuyên sâu

Code ẩn giá và nút mua với khách chưa đăng nhập trong WooCommerce

Trang sản phẩm Balo Du Lịch Chống Nước 20L khi chưa đăng nhập: chỗ giá hiện link 'Đăng nhập để xem giá', chỗ nút mua hiện nút đen 'Đăng nhập để đặt hàng', không thấy giá và nút thêm vào giỏ

Bài viết này mình sẽ hướng dẫn bạn cách ẩn giá và nút mua với khách chưa đăng nhập trong WooCommerce nhé.

Shop bán sỉ hoặc bán cho thành viên muốn giấu giá với khách vãng lai để khách phải đăng nhập mới xem được giá và đặt hàng, tránh bị đối thủ soi bảng giá. WooCommerce mặc định không có tùy chọn ẩn giá theo trạng thái đăng nhập, muốn khách chưa đăng nhập chỉ thấy lời mời đăng nhập thay cho giá và nút mua thì bạn phải code thêm nhé.

Thêm code ẩn giá và nút mua với khách chưa đăng nhập

Bạn chỉ cần thêm code dưới vào cuối file functions.php của child theme nhé. Nhớ sao lưu file trước khi sửa, và đừng chèn vào theme cha vì khi theme cập nhật sẽ mất code.

<?php
// Ẩn giá và nút mua với khách chưa đăng nhập: khách chỉ thấy lời mời đăng nhập
// Thành viên đã đăng nhập vẫn thấy giá và mua hàng bình thường
add_filter('woocommerce_get_price_html', 'nn_an_gia_voi_khach_chua_dang_nhap', 10, 2);
function nn_an_gia_voi_khach_chua_dang_nhap($gia, $san_pham) {
    if (is_user_logged_in()) {
        return $gia;
    }
    return '<a href="' . esc_url(wp_login_url(get_permalink())) . '">Đăng nhập để xem giá</a>';
}
add_filter('woocommerce_is_purchasable', 'nn_khong_cho_khach_chua_dang_nhap_mua', 10, 2);
function nn_khong_cho_khach_chua_dang_nhap_mua($duoc_mua, $san_pham) {
    if (is_user_logged_in()) {
        return $duoc_mua;
    }
    return false;
}
add_action('woocommerce_single_product_summary', 'nn_nut_dang_nhap_thay_nut_mua', 31);
function nn_nut_dang_nhap_thay_nut_mua() {
    global $product;
    if (is_user_logged_in() || !$product) {
        return;
    }
    if (!$product->is_in_stock()) {
        return;
    }
    echo '<a class="button" href="' . esc_url(wp_login_url(get_permalink())) . '">Đăng nhập để đặt hàng</a>';
}

Code trên có ba phần. Phần đầu móc vào filter woocommerce_get_price_html để thay giá bằng link “Đăng nhập để xem giá” với khách chưa đăng nhập, bấm vào thì đi tới trang đăng nhập rồi quay lại đúng sản phẩm đang xem. Phần hai móc vào filter woocommerce_is_purchasable trả về false với khách chưa đăng nhập, nhờ đó nút “Thêm vào giỏ” biến mất cả ở trang sản phẩm lẫn trang danh mục, và khách cũng không thêm hàng bằng link ?add-to-cart= được. Phần ba móc vào woocommerce_single_product_summary để hiện nút “Đăng nhập để đặt hàng” ngay chỗ nút mua cũ, để khách biết phải làm gì tiếp theo thay vì thấy trang sản phẩm trống trơn.

Kiểm tra trên trang sản phẩm

Bạn đăng xuất khỏi tài khoản rồi mở một trang sản phẩm, chỗ giá sẽ hiện link “Đăng nhập để xem giá” và chỗ nút mua sẽ hiện nút “Đăng nhập để đặt hàng”. Đăng nhập lại rồi tải lại trang thì giá và nút “Thêm vào giỏ” hiện lại bình thường. Thử mở trang danh mục sản phẩm, khách chưa đăng nhập cũng chỉ thấy link đăng nhập thay cho giá ở mọi sản phẩm.

Trang sản phẩm Balo Du Lịch Chống Nước 20L khi chưa đăng nhập: chỗ giá hiện link 'Đăng nhập để xem giá', chỗ nút mua hiện nút đen 'Đăng nhập để đặt hàng', không thấy giá và nút thêm vào giỏ
Kết quả: khách chưa đăng nhập chỉ thấy link ‘Đăng nhập để xem giá’ và nút ‘Đăng nhập để đặt hàng’, không thấy giá và nút thêm vào giỏ.

Lưu ý khi dùng

Code này chỉ giấu giá ở trang cửa hàng, trang danh mục và trang sản phẩm, còn trong giỏ hàng và trang thanh toán thì giá vẫn hiện như bình thường vì khách chưa đăng nhập vốn đã không thêm được hàng vào giỏ nên không vào được tới đó. Nếu shop bạn đang bật cho phép đặt hàng không cần tài khoản thì tính năng này coi như bắt khách phải đăng nhập trước khi mua, bạn cân nhắc xem có hợp với cách bán của shop không. Muốn chỉ giấu giá mà vẫn cho khách xem nút mua thì bạn bỏ phần filter woocommerce_is_purchasable đi là được.

Kết luận

Vậy là chỉ với 1 đoạn code ngắn bạn đã ẩn giá và nút mua với khách chưa đăng nhập trong WooCommerce rồi nhé. Tính năng này đi chung với bài code đặt số lượng mua tối thiểu cho sản phẩm trong WooCommerce và bài code hiển thị số tiền tiết kiệm được ở giỏ hàng trong WooCommerce là thành combo kiểm soát đơn hàng cho shop bán sỉ và bán thành viên khá tốt.

Nếu cần mình kèm 1-1 về WooCommerce thì cứ liên hệ mình nhé.

Nhân Viên

Nhân Viên

Web Developer & WordPress Expert

Ngọc Nguyễn - Chuyên gia thiết kế Website WordPress, tối ưu tốc độ 90+ và xử lý dứt điểm mã độc. Đam mê chia sẻ kiến thức hữu ích đến cộng đồng lập trình & webmaster.

Để lại bình luận hoặc thắc mắc

Email của bạn sẽ không được hiển thị công khai.

Ngọc Nguyễn
Ngọc Nguyễn
| Thiết kế Website | Hosting tốc độ cao | Giải pháp hạ tầng | Fix lỗi WordPress, mã độc | Tối ưu tốc độ | Thiết kế Website | Hosting tốc độ cao | Giải pháp hạ tầng | Fix lỗi WordPress, mã độc | Tối ưu tốc độ
Tư vấn miễn phí