Bỏ bớt thông tin thanh toán trên woocommerce năm 2024

Khi thiết lập website với Wordpress bạn sẽ khá bối rối vì mục thanh toán đơn hàng của website có nhiều nội dung không cần thiết, ví dụ như website của bạn chỉ bán hàng ở Việt Nam nên không cần thiết chọn quốc gia, ở Việt Nam việc sử dụng mã bưu điện không phổ biến nên mục này cũng không cần thiết.. tính năng này sẽ giúp bạn xóa bỏ bớt thông tin không cần thiết trong thanh toán đơn hàng qua website hoặc thiết lập thêm các thông tin khác mà bạn muốn

WooCommerce Easy Chekcout Field Editor là tính năng cho phép bạn Thêm / Chỉnh sửa / Xóa các trường trong biểu mẫu thanh toán. Bạn có thể sắp xếp lại chúng bằng cách sử dụng Giao diện người dùng quản trị kéo và thả .Plugin Hỗ trợ 15 loại trường tùy chỉnh được sử dụng rộng rãi. Bạn có thể chọn gửi dữ liệu trường tùy chỉnh với email đặt hàng và cũng có thể hiển thị nó trên trang đặt hàng của quản trị viên.

Các tính năng của tùy chỉnh form thông tin thanh toán đơn hàng WooCommerce Easy Chekcout Field Editor

• Trường thanh toán có điều kiện – hiển thị / ẩn các trường dựa trên giá trị của các trường thanh toán khác.
• Hiển thị các trường Trong Tài khoản của Tôi / Trang Chỉnh sửa Địa chỉ.
• Chỉnh sửa / Quản lý các trường thanh toán cho Woocommerce mặc định
• Xóa các trường Kiểm tra woocommerce mặc định
• Hỗ trợ cho các trường bổ sung
• Thêm các trường tùy chỉnh mới vào biểu mẫu địa chỉ giao hàng và thanh toán hiện tại
• Sắp xếp lại các trường tùy chỉnh với giao diện người dùng kéo và thả
• Xem trước trường trong bảng điều khiển quản trị
• Hiển thị chi tiết trường đã gửi trong trang ấn bản đơn đặt hàng.
• Hiển thị chi tiết trường đã gửi trong email đặt hàng.
• Hiển thị chi tiết lĩnh vực đã gửi trong cấu hình đơn hàng và xem trang đặt hàng.
• Hiển thị chi tiết trường đã gửi trong WooCommerce PDF Invoices & Packing Slips hóa đơn.
• Khôi phục về các trường Mặc định
• Khả năng chỉ hiển thị các trường nếu giỏ hàng chứa các sản phẩm được chỉ định hoặc các sản phẩm từ danh mục nhất định

Các trường tùy chỉnh được hỗ trợ với WooCommerce Easy Chekcout Field Editor

1. Bản văn ngắn
2. Văn bản nhiều dòng
3. Mật khẩu
4. Trường đoạn văn bản cố định
5. Thẻ tiêu đề
6. Lựa chọn thả xuống
7. Lựa chọn danh sách
8. Bảng chọn ngày
9. Hộp kiểm checkbox
10. Nút chọn lựa 1 trong số
11. E-mail
12. Số điện thoại
13. Kiểu định dạng số
14. Bộ chọn ngày giờ
15. Bộ chọn thời gian
16. Bộ chọn Phạm vi Ngày
17. Bộ chọn Phạm vi Ngày giờ.

Hình ảnh tính năng WooCommerce Easy Chekcout Field Editor

Hiển thị hoặc ẩn các trường thanh toán dựa trên giá trị của các trường thanh toán khác

Hiển thị khi giỏ hàng xuất hiện với các sản phẩm được thiết lập

Hiển thị khi giỏ hàng xuất hiện với các loại sản phẩm được thiết lập

Trong một vài trường hợp bạn muốn ẩn hiện hoặc bỏ bớt các trường dữ liệu không cần thiết trong trang thanh toán (Check out) của WooCommerce. Bài viết này sẽ giúp bạn biết cách để tùy chỉnh các trường trong trang thanh toán của WooCommerce bằng cả Plugin và cả code trong funtions.php nhé.

Tùy chỉnh các trường trong trang thanh toán của WooCommerce bằng Plugin

Với những bạn không rành về code thì plugin Checkout Field Editor (Checkout Manager) for WooCommerce sẽ giúp ích khá nhiều cho các bạn trong việc này.

1. Cài đặt

Plugin này miễn phí nên bạn có thể cài đặt trực tiếp trên thư viện plugin của wordpress luôn nhé.

Tại giao diện admin chọn mục Plugin -> Thêm mới Plugin (Add New Plugin) -> Rồi gõ tên plugin trên thanh tìm kiếm rồi cài đặt là được,.

Ngoài ra bạn có thể cài bằng cách up file plugin lên.

Link tải: https://wordpress.org/plugins/woo-checkout-field-editor-pro/

2. Cách sử dụng Checkout Field Editor (Checkout Manager) for WooCommerce

Sau khi kích hoạt Plugin thì vào phần Woocommerce trên giao diện để kiểm tra. Ta sẽ thấy no có thêm 1 tab nửa là Checkout Form

Mỗi một trường dữ liệu (Field) sẽ có các phần tùy chỉnh như sau:

• name : tên field
• type: loại dữ liệu
• label: Tên hiển thị của field
• placeholder: chữ gợi ý trong ô input
• validations: kiểm tra sự phù hợp của dữ liệu
• require: có bắt buộc không
• enable: có đang được bật không (nếu không tích thì nó sẽ ko hiện lên trang checkout nhé)
  

Ngoài ra chúng ta có thể thêm các trường mới vào được luôn. Nếu muốn tùy chỉnh cho trường dữ liệu nào thì chúng ta cứ nhấn vào Edit của trường dữ liệu đó và bắt đầu thiết lập cho hợp lí nhé.

Tóm lại thì Plugin đã rất là tiện lợi cho các bạn vọc vạch đủ kiểu rồi. Vọc chừng nào mà nó nát quá thì nhớ khôi phục cho nó về mặc định lại, cái nút Reset to default Fields đó.

Dùng Code trong file funtions.php để tùy chỉnh các trường trong trang thanh toán của WooCommerce

Các này thì phù hợp với các bạn không thích xài plugin, hoặc trường hợp giống như Web của Ngọc Nguyễn, chỉ cần giữ các trường như Họ tên, Số điện thoại và Email thôi, còn lại xóa hết. Thì áp dụng cách này là nhanh nhất

1. Code bỏ các trường trong trang thanh toán

Add hàm sau vào file funtions.php của theme bạn đang dùng nhé. Khuyến khích dùng theme child cho nó an toàn nhé. Chưa biết tạo theme child thì làm theo bài hướng dẫn dưới.

Child theme là gì? Tại sao phải luôn dùng child theme

add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );
function custom_override_checkout_fields( $fields ) {
     unset($fields['billing']['billing_state']);
   unset($fields['billing']['billing_address_1']);
   unset($fields['billing']['billing_address_2']);
   unset($fields['billing']['billing_city']);
   unset($fields['billing']['billing_postcode']);
   unset($fields['billing']['billing_country']);
   unset($fields['billing']['billing_company']);
   unset($fields['order']['order_comments']);
     return $fields;
}

Với code trên ta chú ý các dòng < unset($fields[‘billing’][‘billing_address_1’]); >. Đây chính là các dòng sẽ xác định mình bỏ trường dữ liệu nào trên trang thanh toán. Để bỏ thêm các dòng khác tùy ý thì ta thêm theo cấu trúc như vậy là được.

Ví dụ mình muốn bỏ phần Tên công ty trong form thông tin vận chuyển của trang thanh toán thì mình sẽ thêm 1 đoạn code trước đoạn return $fields như sau:

unset($fields['Shipping']['shipping_company']);

Dưới đây là danh sách full các trường trong trang checkout của WooCommerce:

Billing Checkout Fields
/
      billing_first_name
      billing_last_name
      billing_company
      billing_address_1
      billing_address_2
      billing_city
      billing_postcode
      billing_country
      billing_state
      billing_email
      billing_phone
/*
Shipping Checkout Fields
/
      shipping_first_name
      shipping_last_name
      shipping_company
      shipping_address_1
      shipping_address_2
      shipping_city
      shipping_postcode
      shipping_country
      shipping_state
/*
Account Checkout Fields
/
      account_username
      account_password
      account_password-2
/*
Order Checkout Fields
*/
      order_comments
`

### 2\. Bỏ bắt buột đối với các trường trong trang checkout woocommerce

$fields['billing']['billing_first_name']['required'] = false;
return $fields;

Kết luận

Vậy là Ngọc Nguyễn đã hướng dẫn các bạn biết cách tùy chỉnh các trường trong trang thanh toán của Woocommerce. Mình biết là trong quá trình dựng một Website sẽ có rất nhiều khó khăn, vì vậy nên bạn đừng ngần ngại liên hệ mình nếu cần giúp đỡ nhé.