Bạn đang tìm cách Ẩn khoảng giá của các sản phẩm biến thể trong WooCommerce?

Theo mặc định, giá cho các sản phẩm biến thể sẽ được hiển thị trong phạm vi. Có một số ít người muốn ẩn phạm vi và hiển thị giá sản phẩm khi chỉ chọn biến thể tương ứng.
 
Rất tiếc, WooCommerce không có bất kỳ chức năng tích hợp nào để giúp bạn đạt được điều đó.
 
Tuy nhiên, đừng lo lắng! Trong hướng dẫn này, An Nhiên sẽ chỉ cho bạn cách ẩn phạm vi giá trong các sản phẩm biến thể WooCommerce chỉ bằng một đoạn code đơn giản.
Ẩn khoảng giá của các sản phẩm biến thể trong WooCommerce
Ẩn khoảng giá của các sản phẩm biến thể trong WooCommerce

Khoảng giá của các sản phẩm biến thể trong WooCommerce là gì?

Sản phẩm có biến thể sẽ cho phép bạn bán cùng một sản phẩm với các kích thước, màu sắc, trọng lượng khác nhau, v.v. Bạn có thể đặt mỗi loại 1 giá khác nhau cho từng sản phẩm.

Theo mặc định, giá cho các biến thể sẽ được hiển thị dưới dạng phạm vi trên trang sản phẩm. ( từ min -> max )

Ẩn khoảng giá của các sản phẩm biến thể trong WooCommerce
Ẩn khoảng giá của các sản phẩm biến thể trong WooCommerce

Điều đó nói rằng, việc hiển thị phạm vi giá không phải lúc nào cũng được chủ WooCommerce ưa thích.

Ví dụ khi khách hàng truy cập trang web của bạn để tìm kiếm một chiếc áo khoác có giá $20.00. Nếu sản phẩm này có biến thể thì hiển thị phạm vi giá ở mức $20.00 – $30.00, khách hàng có khả năng thoát khỏi trang sản phẩm của bạn rất cao và bạn sẽ mất doanh số và khách hàng tiềm năng của mình. Bạn cần xem xét lại phạm vi giá hiển thị.

Trong các trường hợp khác, bạn có thể muốn ẩn hoàn toàn giá cho các sản phẩm có biến thể của mình. Chỉ khi khách truy cập chọn biến thể cụ thể thì giá mới hiển thị. Điều này thu hút khách truy cập của bạn nhấp vào các biến thể để biết thêm chi tiết và do đó, tăng cơ hội chuyển đổi khách truy cập thành khách hàng.

Làm cách nào để ẩn khoảng giá của các sản phẩm biến thể trong WooCommerce

Để ẩn khoảng giá khỏi các trang sản phẩm biến thể, hãy mở tệp functions.php của theme hoặc child theme của bạn. Bạn có thể tìm thấy tệp này trong: Giao diện -> Chỉnh sửa Giao diện trong bảng điều khiển quản trị của bạn.

Nếu bạn gặp khó khăn trong việc tạo theme con, thì bạn có thể sử dụng plugin Code Snippets.

Cách ẩn giá tối đa cho các sản phẩm có biến thể

Khi bạn chỉ muốn hiển thị giá tối thiểu cho sản phẩm. Đoạn Code này sẽ giúp bạn làm được điều đó. Chỉ cần thêm đoạn code sau vào tệp function.php trong theme của bạn. ( Nên cho vào theme child )

function wc_varb_price_range( $wcv_price, $product ) {

$prefix = sprintf('%s: ', __('From', 'wcvp_range'));

$wcv_reg_min_price = $product->get_variation_regular_price( 'min', true );

$wcv_min_sale_price    = $product->get_variation_sale_price( 'min', true );

$wcv_max_price = $product->get_variation_price( 'max', true );

$wcv_min_price = $product->get_variation_price( 'min', true );

$wcv_price = ( $wcv_min_sale_price == $wcv_reg_min_price ) ?

wc_price( $wcv_reg_min_price ) :

'<del>' . wc_price( $wcv_reg_min_price ) . '</del>' . '<ins>' . wc_price( $wcv_min_sale_price ) . '</ins>';

return ( $wcv_min_price == $wcv_max_price ) ?

$wcv_price :

sprintf('%s%s', $prefix, $wcv_price);

}

add_filter( 'woocommerce_variable_sale_price_html', 'wc_varb_price_range', 10, 2 );

add_filter( 'woocommerce_variable_price_html', 'wc_varb_price_range', 10, 2 );

Khi thành công các sản phẩm có biến thể chỉ hiển thị giá tối thiểu. Giá chính xác của sản phẩm sẽ hiện bên trên nút ” Add to cart ” khi bạn chọn đầy đủ biến thể của sản phẩm.

ẩn giá của sản phẩm biến thể

Lời kết

AnNhiên hi vọng sau bài viết này sẽ thay đổi doanh thu và tệp khách hàng của các bạn.

Nếu các bạn thấy hay có thể theo dõi chuyên mục “Hướng dẫn” để biết thêm nhiều điều hơn nhé.