Chỉnh sửa thông tin trang thanh toán trong Woocommerce

Chỉnh Sửa Thông Tin Trang Thanh Toán Trong Woocommerce
Share on facebook
Facebook
Share on pinterest
Pinterest
Share on twitter
Twitter
Share on linkedin
LinkedIn
Share on tumblr
Tumblr

Checkout Field Editor (Checkout Manager) for WooCommerce là plugin sẽ giúp bạn chỉnh sửa thông tin trang thanh toán trong Woocommerce một cách dễ dàng. Ai cũng biết Woocommerce là plugin nổi tiếng nhất giúp xây dựng một trang bán hàng chuyên nghiệp với WordPress. Tuy nhiên, WooCommerce cũng có một số điểm không phù hợp với người Việt Nam. Đặc biệt là phần thông tin thanh toán mà khách hàng phải điền có nhiều trường dữ liệu thông tin dư thừa, ví dụ:

  • Mặc định plugin Woocommerce chia phần họ tên của khách hàng thành 2 phần tách biệt là billing_first_name (tên của bạn) và billing_last_name (họ của bạn). Điều này là không phù hợp với thói quen của người Việt Nam. Để tiết kiệm thời gian cũng như tạo ra sự tiện lợi cho khách hàng thì chúng ta chỉ cần để 1 trường dữ liệu duy nhất là Họ và Tên để khách hàng chỉ cần điền 1 lần thôi.
  • Tương tự cũng có 2 ô địa chỉ là billing_address_1billing_address_2, trong khi chúng ta chỉ cần 1 ô địa chỉ là đủ.
  • Ngoài ra, mặc định Woocommerce cũng có trường dữ liệu như billing_company (công ty của bạn), billing_state (tiểu bang), billing_postcode (mã bưu chính) và billing_country (quốc gia) cũng là không cần thiết.

Chỉnh sửa trang thanh toán để tối ưu thông tin khách hàng

Với một trang bán hàng thông thường thì chúng ta chỉ cần thu thập những dữ liệu sau:

  • Họ và tên của khách hàng;
  • Số điện thoại liên hệ;
  • Địa chỉ email (để tạo tài khoản);
  • Địa chỉ chi tiết nơi nhận hàng;

Khi đó những trường dữ liệu dư thừa hoặc không phù hợp nên được ẩn đi. Có 2 lợi ích rõ ràng:

  • Một là để phần điền thông tin trông gọn gàng, vừa đủ, tiết kiệm thời gian nhập liệu cho khách hàng.
  • Hai là để tối ưu cơ sở dữ liệu. Database không phải lưu trữ những thứ không cần thiết.

Để làm việc này các bạn có nhiều cách, chẳng hạn như thêm các đoạn code vào file function.php của theme hoặc sửa trực tiếp tại thư mục plugin. Tuy nhiên tác động bằng code thì sau này mỗi khi update plugin hoặc theme thì các tùy chỉnh của bạn sẽ trở về mặc định. Hơn nữa không phải ai cũng giỏi về code nên trong bài viết này, mình sẽ hướng dẫn các bạn chỉnh sửa các trường dữ liệu khách hàng bằng cách sử dụng plugin.

Plugin các bạn cần là Checkout Field Editor (Checkout Manager) for WooCommerce

Điều kiện để plugin hoạt động đương nhiên là bạn phải có Woocommerce rồi. Hướng dẫn cách cài đặt và sử dụng plugin WooCommerce ở đây.

Cách sử dụng Checkout Field Editor (Checkout Manager) for Woocommerce

Bước 1: Cài đặt và kích hoạt Plugin WooCommerce Checkout Field Editor. Xem hướng dẫn tại đây nếu bạn chưa biết!

Woocommerce Checkout Field Editor
Woocommerce Checkout Field Editor

Bước 2: Để quản lý các trường dữ liệu thông tin trang thanh toán, bạn vào WooCommerce => Checkout Form

Checkout Form
Checkout Form
  • Mặc định bạn đang ở phần Billing Fields (thông tin thanh toán);
  • Shipping Fields là phần thông tin vận chuyển;
  • Additional Fields là thông tin thêm;
  • Add field là nút để thêm trường dữ liệu thông tin mới;
  • Remove để xóa trường dữ liệu bạn muốn;
  • Enable để kích hoạt;
  • Disable để vô hiệu hóa các dòng thông tin không cần thiết.

Phía dưới là các trường dữ liệu hiện đang sử dụng trong Woocommerce. Theo thứ tự từ trên xuống dưới sắp xếp như nào trong đây thì trang thanh toán bên ngoài website của bạn sẽ hiển thị như thế. Bạn có thể kéo – thả để sắp xếp vị trí, thứ tự tùy ý. Nếu muốn Remove, Enable, Disable thì trước hết cần tích chọn vào ô vuông đằng trước mỗi dòng thông tin.

Muốn sửa dòng dữ liệu nào thì bạn click nút Edit tương ứng bên tay phải của dòng đó sẽ hiện ra bảng:

Edit Filed
Edit Filed

Giải thích các ô dữ liệu của bảng Edit Checkout Field:

  • Name là tên (hoặc ID) lưu trong cơ sở dữ liệu.
  • Type là thể loại/định dạng cho phép nhập liệu (ví dụ text là văn bản, tel là số điện thoại, email là thư điện tử,…)
  • Label là tên hiển thị.
  • Placeholder là nội dung gợi ý cho khách hàng điền thông tin.
  • Class là thuộc tính CSS của vùng nhập liệu (bạn sử dụng form-row-wide nếu muốn đó là 1 dòng duy nhất, muốn chia thành 2 cột thì cột bên trái sử dụng form-row-first và cột bên phải sử dụng form-row-last để chia).
  • Validation là điều kiện/quy tắc bắt buộc. Bạn có 2 lựa chọn: phone là định dạng số điện thoại, email là định dạng thư điện tử. Tức là nếu dữ liệu khách hàng nhập vào đây không đúng định dạng thì sẽ xảy ra lỗi. Điều này nhằm hạn chế khách hàng khai báo thông tin linh tinh.
  • Required nếu có thì không được bỏ trống.

Sau khi sửa xong các trường dữ liệu, bạn cần phải click nút Save changes để lưu lại.

Hy vọng, với bài viết này thì bạn sẽ có thể chỉnh sửa một trang thông tin thanh toán của khách hàng trong Woocommerce hợp lý và vừa ý. Chúc bạn thành công!

Bình luận

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *

Danh mục bài viết