Hướng dẫn tùy chỉnh ẩn giá và nút Thêm vào giỏ hàng trong WooCommerce

Trong một số mô hình kinh doanh đặc thù như website giới thiệu sản phẩm, catalogue trực tuyến hoặc hệ thống đặt hàng yêu cầu báo giá riêng, việc ẩn giá và nút "Thêm vào giỏ hàng" (Add to Cart) trên WooCommerce là yêu cầu kỹ thuật phổ biến. Tại STAR WAR Digital Solutions, chúng tôi chia sẻ phương pháp thực hiện trực tiếp thông qua tệp functions.php của giao diện (theme) mà không cần cài đặt thêm plugin cồng kềnh.

Chuẩn bị tệp tin hỗ trợ

Để đảm bảo nút "Thêm vào giỏ hàng" được loại bỏ hoàn toàn trên trang chi tiết sản phẩm, bạn cần tạo một tệp tin trống có tên no-add-to-cart-button.php. Hãy đặt tệp này vào đường dẫn sau trong thư mục theme của bạn:

/wp-content/themes/ten-theme-cua-ban/woocommerce/no-add-to-cart-button.php

Nếu thư mục woocommerce chưa tồn tại, bạn hãy tạo mới thư mục này trước khi đặt tệp tin vào.

Ẩn nút Thêm vào giỏ hàng

Sử dụng đoạn mã dưới đây để loại bỏ nút mua hàng trên toàn bộ hệ thống WooCommerce của bạn:

add_action( 'init', 'starwar_hide_add_to_cart_button', 1000 );
function starwar_hide_add_to_cart_button() {
    add_filter( 'woocommerce_loop_add_to_cart_link', '__return_null' );
    add_filter( 'wc_get_template', 'starwar_wc_get_template', 90, 2 );
}

function starwar_wc_get_template( $located, $template_name ) {
    $new_path = get_stylesheet_directory_uri() . '/woocommerce/no-add-to-cart-button.php';
    $templates = array(
        'single-product/add-to-cart/simple.php',
        'single-product/add-to-cart/grouped.php',
        'single-product/add-to-cart/variable.php',
        'single-product/add-to-cart/external.php'
    );
    if( in_array( $template_name, $templates ) ) {
        return $new_path;
    }
    return $located;
}

Ẩn giá và nút Thêm vào giỏ hàng cho mọi khách hàng

Nếu bạn muốn chuyển website sang chế độ "Catalogue" (ẩn cả giá và nút mua hàng), hãy sử dụng đoạn mã sau trong tệp functions.php:

add_action( 'init', 'starwar_hide_price_and_cart', 1000 );
function starwar_hide_price_and_cart() {
    add_filter( 'woocommerce_get_price_html', '__return_false' );
    add_filter( 'woocommerce_loop_add_to_cart_link', '__return_null' );
    add_filter( 'wc_get_template', 'starwar_wc_get_template', 90, 2 );
}

Ẩn giá và nút Thêm vào giỏ hàng đối với khách chưa đăng nhập

Đây là giải pháp tối ưu nếu bạn muốn hiển thị thông tin sản phẩm đầy đủ cho đối tác hoặc khách hàng thân thiết đã đăng nhập, nhưng ẩn đi đối với khách vãng lai:

add_action( 'init', 'starwar_hide_price_for_guests', 1000 );
function starwar_hide_price_for_guests() {
    if( is_user_logged_in() ) return;
    
    add_filter( 'woocommerce_get_price_html', '__return_false' );
    add_filter( 'woocommerce_loop_add_to_cart_link', '__return_null' );
    add_filter( 'wc_get_template', 'starwar_wc_get_template', 90, 2 );
}

Lưu ý quan trọng từ STAR WAR

• Sao lưu dữ liệu: Luôn thực hiện sao lưu (backup) tệp functions.php trước khi chỉnh sửa để tránh lỗi phát sinh.
• Child Theme: Chúng tôi khuyến nghị bạn nên sử dụng Child Theme để chèn code, giúp các tùy chỉnh không bị mất đi khi cập nhật giao diện chính.
• Kiểm tra hiển thị: Sau khi lưu tệp, hãy xóa cache của website và trình duyệt để thấy thay đổi ngay lập tức.

Nếu bạn cần hỗ trợ tùy chỉnh chuyên sâu hơn cho hệ thống WooCommerce hoặc tối ưu hóa trải nghiệm người dùng, đội ngũ kỹ thuật tại STAR WAR Digital Solutions luôn sẵn sàng đồng hành cùng doanh nghiệp của bạn.