Home Kiến ThứcWordpress Xóa bỏ bớt trường không cần thiết ở trang thanh toán WooCommerce

Xóa bỏ bớt trường không cần thiết ở trang thanh toán WooCommerce

Bạn đang muốn xóa bỏ bớt một số trường không cần thiết trong trang thanh toán của website bán hàng sử dụng WooCommerce? Mặc định trong Woocommerce thì trang thanh toán của nó khá phức tạp đối với người Việt khi nhập thông tin thanh toán. Bạn muốn bỏ bớt các ô như Tên công ty (Company Name), Quốc gia (Country), Mã bưu điện (Postcode / ZIP), Tỉnh/ Thành phố (Town / City),….nhưng Woocommerce lại không hỗ trợ vô hiệu hóa hoặc xóa các field đó đi. Vậy làm cách nào để xóa những field đó đi một cách dễ dàng nhất. Câu trả lời sẽ có trong bài viết này, bạn hãy đọc và làm theo hướng dẫn dưới đây để có thể xóa bỏ bớt các field không cần thiết ở trang thanh toán trong web bán hàng WordPress nhé.

xoa-bo-bot-truong-khong-can-thiet-o-trang-thanh-toan-woocommerce-11

Hướng dẫn xóa bỏ bớt trường không cần thiết trong Woocommerce

Để xóa bỏ các trường không cần thiết trong trang Checkout Woocommerce mình có 2 cách. Trong bài này mình sẽ hướng dẫn các bạn cả 2 cách. Nếu bạn không thích đụng vào code thì có thể dùng plugin còn bạn nào thích đụng vào code thì cũng có cách cho các bạn luôn ?

Cách 1: Sử dụng plugin Woo Checkout Field Editor Pro

Với những bạn không thích đụng vào code thì đây là cách nhanh và đơn giản để bạn có thể loại bỏ các field không cần thiết trong trang thanh toán. Có thể bạn cũng xem qua 1 số trang hướng dẫn sử dụng plugin WooCommerce Checkout Manager để xóa bỏ những trường không cần thiết nhưng giờ plugin này đã bị xóa rồi và mình thấy thì nó cũng không hay lắm. Trong bài này mình giới thiệu với các bạn plugin Woo Checkout Field Editor Pro. Cá nhân mình dùng thấy nó khá nhẹ gọn và rất đơn giản mà hiệu quả.

Đầu tiên các bạn cài đặt plugin Woo Checkout Field Editor Pro vào website. Sau đó truy cập menu WooCommerce -> Checkout Form sẽ thấy giao diện của plugin như sau:

xoa-bo-bot-truong-khong-can-thiet-o-trang-thanh-toan-woocommerce-2

 Xóa bỏ trường không cần thiết ngoài trang thanh toán: Bạn tick chọn trường cần bỏ đó rồi click vào Disable sau đó click vào Save changes để lưu thay đổi là xong.

– Sửa đổi thuộc tính của trường: Để sửa đổi thuộc tính bạn click vào mục Edit tương ứng với trường đó rồi sẽ thấy bảng cài đặt hiện lên như sau:

xoa-bo-bot-truong-khong-can-thiet-o-trang-thanh-toan-woocommerce-3

Ở đây bạn chỉ cần để ý đến các mục:

  • Label: Đây là tên trường hiển thị trên trang thanh toán Woocommerce.
  • Class: Ở đây bạn có thể đặt tên class cho trường đó để sau có thể tùy chỉnh css riêng.
  • Required: Tick vào nếu trường đó là bắt buộc khách hàng phải nhập thông tin vào.
  • Clear Row: Tick chọn nếu muốn trường đó nằm 1 mình 1 hàng.
  • Enabled: Bật hoặc tắt trường đó. Tick vào nó để bật hiển thị trên trang thanh toán (checkout).

Sau khi tùy chỉnh xong bạn click vào Edit Field để hoàn thành. Sau khi chỉnh sửa xong bạn nhớ phải click vào Save changes để lưu lại toàn bộ các thay đổi.

Như vậy sau khi bạn loại bỏ các trường không cần thiết đi thì trang thanh toán của Woocommerce chỉ còn đơn giản như này thôi.

xoa-bo-bot-truong-khong-can-thiet-o-trang-thanh-toan-woocommerce-4

Có thể bạn quan tâm: Xóa bỏ /product-category/ trong Url danh mục sản phẩm Woocommerce

Cách 2: Sử dụng code chèn vào file functions.php

Cách này dành cho bạn nào không thích dùng plugin nhé. Để xóa 1 trường trong phần thanh toán bạn chèn code dưới vào file functions.php trong theme bạn đang sử dụng.

add_filter( 'woocommerce_checkout_fields' , 'custom_override_checkout_fields' );
function custom_override_checkout_fields( $fields ) {
     unset($fields['billing']['billing_state']);
     return $fields;
}

Ở đây, nếu bạn muốn xóa một trường nào đó trong trang thanh toán thì bạn chỉ cần viết thêm 1 dòng unset(……..) nữa là xong.

Như trong dòng code trên bạn thấy dòng code unset($fields[‘billing’][‘billing_state’]); chứ? Ở đây bạn chỉ cần để ý đến 2 giá trị đó là billing và giá trị billing_state . Bây giờ dựa vào danh sách các giá trị dưới đây bạn lựa chọn thay thế nó để xóa những field bạn không muốn hiển thị.

Mục Thanh toán (Billing): billing

  • Họ ( First Name)billing_first_name
  • Tên (Last Name)billing_last_name
  • Tên công ty (Company Name)billing_company
  • Địa chỉ (Address): billing_address_1
  • Địa chỉ 2billing_address_2
  • Tỉnh/Thành phố (Town/City)billing_city
  • Mã bưu điện (Postcode)billing_postcode
  • Quốc gia (Country)billing_country
  • Bang/Hạt (State)billing_state
  • Địa chỉ email (Email Address)billing_email
  • Số điện thoại (Phone)billing_phone

Mục Vận chuyển (Shipping)shipping

  • Họ ( First Name): shipping_first_name
  • Tên (Last Name): shipping_last_name
  • Tên công ty (Company Name): shipping_company
  • Địa chỉ (Address): shipping_address_1
  • Địa chỉ 2: shipping_address_2
  • Tỉnh/Thành phố (Town/City): shipping_city
  • Mã bưu điện (Postcode): shipping_postcode
  • Quốc gia (Country): shipping_country
  • Bang/Hạt (State): shipping_state

Mục Thêm thông tin ghi chú (Additional Infomation)order

  • Ô thêm ghi chúorder_comments

Như vậy dựa theo hướng dẫn ở trên mình muốn xóa bỏ các trường Tên công ty, Quốc gia, Địa chỉ 2, Tỉnh/Thành phố, Bang/Hạt, Mã bưu điện thì chỉ cần thêm đoạn code sau:

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

Sau khi thêm đoạn code trên và lưu lại file functions.php là đã có thể xóa bỏ được những trường không cần thiết và bạn sẽ được trang thanh toán gọn gàng và dễ dàng cho khách hàng như sau:

xoa-bo-bot-truong-khong-can-thiet-o-trang-thanh-toan-woocommerce-5

Có thể bạn quan tâm