Tùy biến Emails đơn hàng trong WooCommerce

Quảng cáo
Ads_ngang
Website dinhthuanit.com có bài Tùy biến Emails đơn hàng trong WooCommerce

Bạn muốn thay đổi các mẫu emails gửi thông báo đi từ WooCommerce, đó là files email templates được sử dụng để gửi cho khách hàng rồi cho chủ cửa hàng mỗi khi buổi lễ được kích hoạt như xác nhận đơn hàng. Trong bài này bạn sẽ tìm hiểu các templates này và cách sửa chúng.

Nếu bạn phải thiết kế một email đẹp mắt, bạn sẽ cực kỳ cần các công cụ tạo responsive email để bổ trợ bạn thiết kế HTML tốt hơn.

Giao diện mẫu của email trông giống thế này.

WooCommerce cho phép một số tùy chỉnh cơ bản để thay đổi cấu trúc mẫu email trong quản trị. Bạn có thể tham khảo các tùy chọn tại WooCommerce > Emails > Email Options . Mình có note chi tiết dưới đây:

  • Đặt tên / địa chỉ “Từ” mà khách hàng thấy
  • Thêm hình ảnh cho tiêu đề
  • Thay đổi văn bản chân trang email
  • Chọn màu chữ, nền và nội dung không trùng lặp

Hãy nhớ rằng cấu hình này sẽ áp dụng cho toàn bộ emails. Một lát nữa chúng ta sẽ bắt đầu tạo một thương hiệu mới bằng cách thêm logo, thay đổi dòng văn bản ở footer và mầu sắc. Bạn có thể tưởng tượng nó trông như thế này:

Ngoài ra, bạn có thể thay đổi font chữ, bằng phương pháp sửa HTML trong file wordpress/wp-content/plugins/woocommerce/includes/abstracts/abstract-wc-email.php . Trong file này bạn cũng có thể tìm và thay thế thẻ h1,h2,h3 & font chữ bởi các hàm style_inline_h1_tag,style_inline_h2_tag,style_inline_h3_tag .

Cấu hình emails

Mỗi loại emails có những tùy chọn riêng, bạn có thể cài đặt trong phần WooCommerce > Settings > Emails > Processing order . Ở đây bạn có thể chỉnh sửa thêm nội dung cho loại email này, ví dụ:

  • Cấu hình email có được gửi đi hay không (bật / tắt)
  • Tiêu đề email
  • Tiêu đề email (mặc định là “Cảm ơn lô hàng của bạn”)
  • Email được gửi dưới dạng HTML hay văn bản thuần túy (mặc định là HTML)

Ghi đè Email Templates

WooCommerce có riêng một bộ Email templates, bạn cũng đều có thể tìm nhanh ở thư mục wordpress/wp-content/plugins/woocommerce/templates/emails/ . Trong thư mục này còn có hơi nhiều files như email thông báo tạo tài khoản, đơn đặt hàng, khôi phục mật khẩu..các files đều được đánh tên theo từng chức năng, bạn dễ dàng tìm và chỉnh sửa chúng.

Thay đổi trực tiếp những tập tin này sẽ chẳng cần là một cách tiếp cận khôn ngoan. Vì bản cập nhật plugin WooCommerce sẽ ghi đè lại các tệp này và toàn bộ những thay đổi của những templates này sẽ quay về mặc định. Vì vậy, để thực hiện sửa đổi cách khéo léo là bạn Sao chép thư mục ’emails’ đến /wp-content/themes/your-active-theme/woocommerce . Lưu ý: Tạo thư mục mang tên ‘woocommerce’ trong thư mục themes, nếu thư mục đó chưa có.

Giờ đây, bạn cũng có thể có thể thi hành mọi thay đổi cho giao diện email và chắc chắn rằng mỗi khi bạn cập nhật plugin WooCommerce sẽ không ghi đè lên thay đổi của bạn. Nếu bạn muốn thay đổi màu, phông chữ bạn cũng có thể sử dụng công cụ phụ trợ để thiết kế.


Trước tiên, hãy đảm bảo bạn đã tạo thư mục your-theme/woocommerce/emails/ và cơpy file wp-content/plugins/woocommerce/templates/emails/email-styles.php vào thư mục này. Mở file email-styles.php và sửa mầu chữ footer thành mầu đen. Tìm và sủa đoạn code sau:

 ... $credit = " border:0; color: black; font-family: Arial; font-size:12px; line-height:125%; text-align:center; "; ...  

Tùy biến emails sử dụng Actions & Filters

Thêm một cách khác vô cùng hiệu quả, bạn có thể sửa mọi cấu trúc HTML trong email thông qua sử dụng WooCommerce API Hooks. Lợi ích sử dụng cách thức này bạn không còn hoài nghi, vì tính linh hoạt và đơn giản nâng cấp.

Ví dụ, chúng ta sẽ thêm thông tin về thanh toán trong email dựa trên phương thức thanh toán khách hàng sử dụng. Để làm điều ấy bạn thêm dòng code sau vào file functions.php

 // Adds instructions for order emails function add_order_email_instructions( $order, $sent_to_admin ) { if ( ! $sent_to_admin ) { if ( 'cod' == $order-> payment_method ) { // cash on delivery method echo ' 

Instructions: Full payment is due immediately upon delivery. Cash only, no exceptions .

'; } else { // other methods (ie credit card) echo '

Instructions: Please look for "Madrigal Electromotive GmbH" on your next credit card statement.

'; } } } add_action( 'woocommerce_email_before_order_table', 'add_order_email_instructions', 10, 2 );

Như vậy khi người dùng chọn phương thức thanh toán “Cash on Delivery” hay xem là COD, khách hàng sẽ nhận được một email với thông tin khác để hướng dẫn khách hàng của mình sử dụng về hình thức phải trả mà người ta có chọn.

Plugin hoặc cấu hình cổng thanh toán

Có một số plugins hoặc cổng thanh toán cho phép chúng ta tùy chỉnh một số phần trong email đơn hàng. Chẳng hạn, thanh toán chuyển khoản bạn sẽ được thêm trường nhập nội dung có chứa tin tức về tài khoản ngân hàng, nội dung này sẽ có hiển thị trong email.

Bên cạnh đó, bạn cũng có thể cài plugins để tùy chỉnh emails, nếu bạn phải thay đổi email đơn hàng cũng có thể sử dụng plugin jilt, email sẽ có gửi tử dịch vụ jilt thay vì mặc định gửi email từ website WordPress của bạn. Dưới đây là một lô hàng thí dụ sau khi đặt mua thành công.

jilt là dịch vụ miễn phí và có trả phí, và bạn cũng sử dụng nó với mục đích “abandoned carts”

Kết luận

Trong bài viết này tôi đã nói các kỹ thuật để bạn có thể tùy chỉnh giao diện emails, từ việc thiết lập cấu hình trong WordPress admin đến cách sử dụng nâng cao bằng WooCommerce API. Nếu bạn thấy bài viết này hữu ích, đừng ngại đặt câu hỏi cho chúng tôi hoặc có 1 cách của riêng bạn, hãy chia sẻ với mọi người dưới bài viết này nhé!

Nếu bạn thích bài viết này, hãy cỗ vũ chúng tôi bằng cách đăng ký nhận bài viết mới ở bên dưới và hãy nhớ chia sẻ kiến thức này với bạn bè của bạn nhé. Bạn cũng cũng đều có thể theo dõi blog này trên Twitter và Facebook

Bài viết Tùy biến Emails đơn hàng trong WooCommerce được tổng hợp và biên tập bởi: dinhthuanit.com. Mọi ý kiến đóng góp và phản hồi vui lòng gửi Liên Hệ cho dinhthuanit.com để điều chỉnh. dinhthuanit.com xin cảm ơn.

Bài Viết Liên Quan


Bài Viết Khác


Quảng cáo
Ads_ngang