[Hướng dẫn] Tạo yêu cầu kèm theo khi mua sản phẩm trong woocommerce

tao-yeu-cau-di-kem-khi-dat-hang-trong-woocommerce

Tạo yêu cầu kèm theo khi mua sản phẩm trong woocommerce: Đối với 01 website bán hàng, nhất là các mặt hàng điện tử – điện lạnh thì việc có 1 nhân viên kỹ thuật đi cùng khi giao hàng là rất cần thiết để tránh những rủi ro phát sinh trong quá trình vận chuyển. Tuy nhiên, không phải khách hàng nào cũng cần có yêu cầu như vậy, và đối với những khách có yêu cầu thì cũng không biết phải làm thế nào khi đặt hàng.

Hôm nay, Flatsomea-z sẽ hướng dẫn các bạn tạo 1 yêu cầu kèm theo khi mua sản phẩm trong woocommere nhé!

tao-yeu-cau-di-kem-khi-dat-hang-trong-woocommerce
tao-yeu-cau-di-kem-khi-dat-hang-trong-woocommerce

Bước 1: Tạo checkbox yêu cầu kèm theo khi đặt hàng

Đầu tiên chúng ta tạo một checkbox yêu cầu kèm theo như hình trên với code HTML đơn giản bên dưới. Copy và dán vào phần trước nút Add to cart (Truy cập Giao diện -> Tuỳ biến -> Woocommerce -> Product Page -> Insert html before Add to cart)

<input type="checkbox" id="yeucau" name="yeucau" value="HỖ TRỢ COPY DANH BẠ, HD SỬ DỤNG, GIẢI ĐÁP">
<label for="yeucau">Yêu cầu nhân viên kỹ thuật giao hàng: hỗ trợ copy danh bạ, hướng dẫn sử dụng máy mới, giải đáp thắc mắc sản phẩm.
</label>

Nó sẽ trông như thế này:

Xong phần tạo checkbox, kế đến chúng ta sẽ hook checkbox này vào form add_to_cart nhé

Bước 2: Hook checkbox vào form add_to_cart

Đầu tiên chúng ta cho checkbox vào 1 function như sau:

<?php function checkboxkemtheo(){;?>
<input type="checkbox" id="yeucau" name="yeucau" value="HỖ TRỢ COPY DANH BẠ, HD SỬ DỤNG, GIẢI ĐÁP">
<label for="yeucau">Yêu cầu nhân viên kỹ thuật giao hàng: hỗ trợ copy danh bạ, hướng dẫn sử dụng máy mới, giải đáp thắc mắc sản phẩm.
</label>
<?php }

Và add vào hook của form add_to_cart

add_action( 'woocommerce_before_add_to_cart_button', 'checkboxkemtheo' );

Bước 3: Lưu data vào trang giỏ hàng

Để có thể lưu data vào trang giỏ hàng, chúng ta sẽ sử dụng đoạn code sau:

function add_hotro_to_cart_item( $cart_item_data, $product_id, $variation_id ) {
$hotro = filter_input( INPUT_POST, 'yeucau' );
if ( empty( $hotro ) ) {
return $cart_item_data;
}
$cart_item_data['yeucau'] = $hotro;
return $cart_item_data;
}
add_filter( 'woocommerce_add_cart_item_data', 'add_hotro_to_cart_item', 10, 3 );

Sau khi lưu thì chúng ta sẽ cho hiển thị

function display_hotro_into_cart( $item_data, $cart_item ) {
if ( empty( $cart_item['yeucau'] ) ) {
return $item_data;
}
$item_data[] = array(

'key' => 'Yêu cầu hỗ trợ',
'value' => wc_clean( $cart_item['yeucau'] ),
'display' => '',
);
return $item_data;
}
add_filter( 'woocommerce_get_item_data', 'display_hotro_into_cart', 10, 2 );

Khi vào trang giỏ hàng bạn sẽ thấy kết ủa như thế này

giohang

Bước 4: Hiển thị yêu cầu hỗ trợ trong checkout

Hook vào woocommerce_checkout_create_order_line_item bạn sẽ xong việc hiển thị tại checkout và quản trị admin. Add đoạn function này vào nhé

function add_hotro_to_order_items( $item, $cart_item_key, $values, $order ) {
if ( empty( $values['yeucau'] ) ) {
return;
}
$item->add_meta_data('Yêu cầu hỗ trợ', $values['yeucau'] );
}
add_action( 'woocommerce_checkout_create_order_line_item', 'add_hotro_to_order_items', 10, 4 );
Tạo checkbox yêu cầu kèm theo khi đặt hàng
Tạo checkbox yêu cầu kèm theo khi đặt hàng

Vậy là xong, thử load lại trang sản phẩm và xem nhé ^^

Chúc các bạn thành công!

Nguồn: pttuan410[[.]com

Trả lời

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