[Woocommerce] Thêm tỉnh thành Việt Nam và tối ưu lại thông tin khách hàng

SERIESCơ bảnWordPress

Học Woocommerce

Bài 21 / 32· 66%

1. [WooCommerce] Tích hợp Ngân Lượng và Bảo Kim
2. [Woocommerce] Tìm hiểu các trang trong Woocommerce
3. [Woocommerce] Thêm một sản phẩm đơn giản
4. [Woocommerce] Tính phí giao hàng toàn tập
5. [Woocommerce] Các thiết lập thanh toán
6. [Woocommerce] Thiết lập thanh toán qua PayPal
7. [Woocommerce] Các thiết lập Tài khoản
8. [Woocommerce] Đưa liên kết lên menu
9. [Woocommerce] Thiết lập Email thông báo
10. [Woocommerce] Quản lý đơn hàng
11. [Woocommerce] Tạo sản phẩm có thuộc tính
12. [Woocommerce] Tạo tùy chọn sản phẩm chuyên nghiệp với Extra Product Options
13. [Woocommerce] Thêm sản phẩm liên kết ngoại
14. [Woocommerce] Thêm nhóm sản phẩm
15. [Woocommerce] Thiết lập shop làm trang chủ
16. [Woocommerce] Các thiết lập cài đặt cơ bản
17. [Woocommerce] Thay đổi kích thước ảnh sản phẩm
18. [Woocommerce] Cài đặt và thiết lập cơ bản
19. [Woocommerce] Giới thiệu plugin WooCommerce
20. [Woocommerce] Thiết lập thuế
21. → [Woocommerce] Thêm tỉnh thành Việt Nam và tối ưu lại thông tin khách hàng
22. [Woocommerce] Cách sử dụng theme Storefront
23. [Woocommerce] Danh sách các widget của Woocommerce
24. [WooCommerce] Phân khu vực hiển thị sidebar với WooSidebars
25. [Woocommerce] Tối ưu đường dẫn tĩnh
26. [Woocommerce] Tăng sức mạnh với YITH Essential Kit for Woocommerce
27. [Woocommerce] Cách sử dụng YITH WooCommerce Color and Label Variations
28. [Woocommerce] Thêm hiệu ứng zoom ảnh sản phẩm
29. [WooCommerce] Thiết lập các plugin cache
30. [WooCommerce] Thiết lập Yoast SEO cho WooCommerce
31. [Woocommerce] Cấu trúc template của Woocommerce
32. [Woocommerce] Cách dùng Action Hook và Filter Hook

Như qua các bài hướng dẫn trước bạn đã có nhiều dịp đi tới trang thanh toán của Woocommerce thì sẽ thấy phần nhập thông tin thanh toán có phần không phù hợp với Việt Nam. Cụ thể là ở Việt Nam không cần địa chỉ dòng 2, không cần mã bưu chính và phải có tỉnh thành của Việt Nam thay vì chọn tiểu bang.

Trong bài này mình sẽ hướng dẫn cách thêm danh sách tỉnh thành của Việt Nam thay vào phần tiểu bang khi chọn quốc gia là Việt Nam, cách dịch chữ Tiểu bang thành Tỉnh thành, dịch chữ Tỉnh thành/thành phố thành quận huyện và ẩn mã bưu chính đi cho phù hợp.

Cài plugin Vietnam Woocommercy Currency

Tải plugin

Đây là plugin do mình làm cách đây cũng 2 năm rồi kể từ khi viết bài này, nó sẽ có các chức năng là:

• Thêm danh sách các tỉnh thành của Việt Nam vào phần Bang/Hạt (States)
• Có thể sử dụng phương thức thanh toán qua PayPal với tiền tệ Việt Nam vì nó sẽ tự chuyển qua USD với tỉ giá quy đổi theo ý muốn khi thanh toán qua PayPal.
• Thêm tiền tệ VNĐ cho Woocommerce. Cái này không cần nữa vì mặc định bây giờ Woocommerce đã có rồi.

Chỉ vậy thôi. Tương lai rảnh mình sẽ bổ sung thêm tính năng.

Sau khi cài đặt, bạn sẽ cần thiết lập lại địa chỉ ở Woocommerce -> Cài đặt.

Và nếu bạn cần thiết lập lại tỷ giá USD để nó tự chuyển từ đồng Việt Nam sang USD khi thanh toán PayPal thì thiết lập ở menu Woocommerce VNĐ.

Sửa tên các trường địa chỉ và xóa mã bưu chính

Dưới đây là đoạn code ngắn đổi tên lại phần Bang / Hạt và Thành phố trong Woocommerce cho phù hợp với Việt Nam. Mặc dù các bạn có thể đổi trong bảng dịch qua plugin Loco Translate nhưng mình không khuyến khích vì như thế sẽ bị mất khi bạn cập nhật bản dịch mới, thành ra cách tốt nhất là sử dụng filter hook để đặt lại tên mà thôi.

Bạn hãy vào Giao diện -> Sửa và tìm tập tin functions.php rồi thêm đoạn này vào cuối tập tin (thêm trước ?> nếu có nó ở cuối tập tin).

PHPCopy

/**

 * Ẩn mã bưu chính

 * Ẩn địa chỉ thứ hai

 * Đổi tên Bang / Hạt thành Tỉnh / Thành

 * Đổi tên Tỉnh / Thành phố thành Quận / Huyện

 *

 *

 * @hook woocommerce_checkout_fields

 * @param $fields

 * @return mixed

 */

function tp_custom_checkout_fields( $fields ) {

 // Ẩn mã bưu chính

 unset( $fields['postcode'] );
 // Ẩn địa chỉ thứ hai

 unset( $fields['address_2'] );
 // Đổi tên Bang / Hạt thành Tỉnh / Thành

 $fields['state']['label'] = 'Tỉnh / Thành';
 // Đổi tên Tỉnh / Thành phố thành Quận / Huyện

 $fields['city']['label'] = 'Quận / Huyện';
 return $fields;

}

add_filter( 'woocommerce_default_address_fields', 'tp_custom_checkout_fields' );

Sau đó vào Giao diện -> Sửa và tìm tập tin style.css rồi thêm đoạn này vào cuối:

CSSCopy

#billing_city_field,#shipping_city_field {

 float: none;

 width: 100%;

}

Ở đây nếu bạn nào biết qua code thì nên xem qua bài hướng dẫn tùy biến checkout fields của WooThemes để hiểu thêm về cách sử dụng nó, rất dễ.

Sau khi thêm xong, hãy lưu lại và ra lại trang đặt hàng sẽ có kết quả như sau:

Nếu bạn nào có hỏi là có thể làm cái mục chọn Quận/Huyện như Tỉnh/Thành mà không cần nhập thủ công hay không, thì mình xin trả lời là có nhưng mình chưa có giải pháp nào tối ưu để làm phần đó có thể tương thích với các plugin khác có tính năng liên quan đến việc sử dụng Quận / Huyện nên bây giờ bạn tạm dùng thủ công đi nhé.

Nếu bạn cần plugin hỗ trợ quản lý và tùy biến lại các trường checkout này thì có thể sử dụng Woocommerce Checkout Manager, nó sẽ giúp bạn ẩn hoặc thêm các trường tùy thích. Bản pro nó có thể giúp bạn thêm cái quận huyện dễ dàng.

Lời kết

Sau bước này rồi thì mình nghĩ bạn cũng đã tùy chỉnh được kha khá trong Woocommerce rồi đó, và chắc chắn những thiết lập trong Woocommerce bạn cũng đã nắm qua. Nếu trong bài bạn nào không rành code mà bị lỗi khi làm theo thì hãy gửi hỗ trợ lên diễn đàn hoidap.blog.thachpham.com để được trợ giúp nhanh nhất nhé.