Cách khắc phục lỗi email HTML trong form WordPress chi tiết từ A-Z

WordPress form email html lỗi là một trong những vấn đề khiến nhiều quản trị website đau đầu. Khi khách hàng gửi thông tin qua form liên hệ nhưng email nhận được hiển thị dưới dạng văn bản thuần, thiếu định dạng, bị chèn code lộn xộn hoặc thậm chí không gửi được. Vấn đề này ảnh hưởng trực tiếp đến khả năng tiếp nhận lead và giao tiếp với khách hàng. Bài viết này sẽ đi sâu vào nguyên nhân, cách kiểm tra và các giải pháp toàn diện để bạn tự khắc phục lỗi email HTML trên form WordPress.

Bản chất của lỗi email HTML trong form WordPress

Khi bạn sử dụng plugin tạo form như Contact Form 7, WPForms, Elementor Pro hay Gravity Forms, mỗi plugin đều có cơ chế xử lý email riêng. Thông thường, nội dung email được gửi dưới dạng HTML với các thẻ như p, br, table, strong. Nhưng đôi khi do xung đột plugin, lỗi cấu hình hoặc giới hạn của máy chủ, email HTML bị biến thành text thuần hoặc hiển thị sai định dạng.

Lỗi này không đơn thuần là vấn đề thẩm mỹ. Khi email không có định dạng, các đường link trở nên khó nhấp, thông tin bị dồn thành một khối, người nhận không phân biệt được tiêu đề và nội dung. Điều này dẫn đến tỷ lệ mở email giảm, tin nhắn bị bỏ qua hoặc bị đánh dấu spam.

Nguyên nhân phổ biến gây ra lỗi form email HTML

Thiếu cấu hình Content-Type trong header email

Mỗi email cần có header Content-Type để xác định định dạng. Nếu header này bị thiếu hoặc đặt sai, email client sẽ hiển thị nội dung dưới dạng văn bản thuần. WordPress mặc định sử dụng `wp_mail()` function, và nếu không chỉ định rõ content type, nó sẽ mặc định là text/plain.

Plugin form không hỗ trợ email HTML đúng cách

Một số phiên bản cũ của plugin Contact Form 7 hoặc Fluent Forms có thể bị lỗi trong việc truyền tham số content_type. Ngoài ra, nếu bạn tự custom template email bằng filter nhưng viết sai hook, kết quả email sẽ không có format.

Xung đột với plugin bảo mật hoặc tối ưu email

Các plugin như WP Mail SMTP, Easy WP SMTP, Post SMTP thường can thiệp vào quá trình gửi email. Nếu chúng không được cấu hình đúng, chúng có thể ghi đè header email, loại bỏ các thẻ HTML hoặc chuyển đổi sang multipart/alternative không phù hợp.

Giới hạn của máy chủ hosting

Một số nhà cung cấp hosting chặn việc sử dụng hàm mail() hoặc giới hạn việc gửi email từ localhost. Họ có thể tự động strip HTML tags để giảm tải hoặc chống spam. Trường hợp này thường gặp ở các gói shared hosting giá rẻ.

Mã hóa nội dung bị sai

Khi bạn copy nội dung từ trình soạn thảo WordPress có chứa các ký tự đặc biệt, khoảng trắng thừa hoặc dấu ngoặc kép không đúng chuẩn, quá trình xử lý có thể làm hỏng cấu trúc HTML, dẫn đến hiển thị lộn xộn.

Phân loại các dạng lỗi email HTML thường gặp

Loại lỗi	Biểu hiện	Nguyên nhân chính
Email text thuần	Nội dung hiển thị như văn bản đơn giản, không có đoạn, không in đậm	Thiếu Content-Type header hoặc mặc định text/plain
Mã HTML lộ ra ngoài	Người nhận thấy cả thẻ mở và đóng như <p>, <br>	Email client không xử lý được HTML hoặc header sai charset
Email trắng hoặc thiếu nội dung	Chỉ có subject, body rỗng hoặc xuất hiện dấu chấm than	Xung đột plugin hoặc lỗi trong quá trình hook ghi đè
Email bị đánh dấu spam	Không vào hộp thư đến, nằm trong spam	Thiếu DKIM, SPF hoặc nội dung không đúng chuẩn HTML email

Quy trình kiểm tra lỗi email HTML từ WordPress form

Trước khi tìm giải pháp, bạn cần xác định chính xác lỗi nằm ở đâu. Hãy thực hiện các bước sau:

• Gửi email test từ plugin form: Tạo một form đơn giản chỉ gồm trường họ tên và email. Gửi thử và kiểm tra kết quả.
• Kiểm tra header email: Sử dụng công cụ như Mail Tester hoặc xem raw email trong Gmail để biết content_type là text/plain hay text/html.
• Vô hiệu hóa plugin khác: Tạm tắt các plugin liên quan đến email, bảo mật, cache. Nếu lỗi hết, đó là xung đột.
• Kiểm tra theme: Chuyển sang theme mặc định như Twenty Twenty-Four. Nếu email HTML hoạt động, lỗi thuộc về theme.
• Xem log lỗi: Bật WP_DEBUG và kiểm tra file error log của hosting để tìm thông báo lỗi liên quan đến wp_mail.

Hướng dẫn chi tiết sửa lỗi email HTML cho form WordPress

Cách 1: Thêm filter để ép content type

Đây là giải pháp nhanh và hiệu quả nhất. Bạn thêm đoạn code sau vào file functions.php của theme:

add_filter( 'wp_mail_content_type', 'set_html_content_type' );
function set_html_content_type() { return 'text/html';
}

Đoạn code này buộc tất cả email gửi từ WordPress sử dụng định dạng HTML. Tuy nhiên, nếu bạn có plugin gửi email marketing (như MailPoet) can thiệp, có thể gây ra lỗi ngược lại. Khi đó bạn cần áp dụng filter có điều kiện:

add_filter( 'wp_mail_content_type', function( $content_type ) { if ( isset( $_POST['_wpcf7'] ) ) { return 'text/html'; } return $content_type;
});

Cách 2: Cấu hình SMTP đúng chuẩn

Hầu hết lỗi email HTML xuất phát từ việc gửi qua hàm mail() mặc định của PHP, không hỗ trợ header phức tạp. Sử dụng plugin SMTP như WP Mail SMTP sẽ giải quyết triệt để. Bạn cần:

• Chọn mailer: SMTP, SendGrid, Mailgun hoặc Gmail API.
• Nhập thông tin máy chủ SMTP, cổng (thường 465 SSL hoặc 587 TLS).
• Đảm bảo sử dụng xác thực (authentication).
• Kiểm tra tính năng “Force From Email” để tránh lỗi gửi từ email không xác thực.

Cách 3: Sửa template email trong plugin form

Các plugin thường cho phép tùy chỉnh nội dung email. Bạn cần đảm bảo template gốc sử dụng HTML. Ví dụ với Contact Form 7, bạn vào Dashboard > Contact Form 7 > Edit form, chuyển tab “Mail” và trong phần “Message body”, hãy viết trực tiếp HTML:

<p><strong>Họ tên:</strong> [your-name]</p>
<p><strong>Email:</strong> [your-email]</p>
<p><strong>Nội dung:</strong></p>
<p>[your-message]</p>

Nếu sau đó vẫn lỗi, hãy kiểm tra xem plugin có filter làm sạch HTML không. Một số plugin thêm filter `wpcf7_mail_components` có thể loại bỏ thẻ.

Cách 4: Sử dụng plugin chuyên tạo email HTML

Khi các cách trên không hiệu quả,

Nguyên nhân là do header Content-Type bị đặt thành text/plain hoặc thiếu. Email client nhận được văn bản chứa thẻ HTML nhưng không biết phải parse chúng, nên hiển thị nguyên gốc. Giải pháp là thêm filter ép content type thành text/html hoặc cấu hình SMTP đúng.

Lỗi email HTML có ảnh hưởng đến khả năng gửi email không?

Không trực tiếp. Email vẫn được gửi đi, nhưng trải nghiệm người nhận rất kém. Tuy nhiên, nếu nội dung email có quá nhiều ký tự đặc biệt hoặc đường dẫn bị hỏng, spam filter có thể đánh dấu email là đáng ngờ.

Có cần cài plugin SMTP để khắc phục lỗi này không?

Không bắt buộc, nhưng rất khuyến khích. SMTP giúp email được gửi đúng cách, hỗ trợ header HTML, xác thực tên miền, tăng tỷ lệ vào hộp thư đến. Nếu bạn chỉ muốn sửa lỗi HTML đơn giản, filter content type là đủ.

Làm thế nào để kiểm tra email đã được gửi dưới dạng HTML hay chưa?

Có. Một số theme có chức năng tùy chỉnh email template hoặc thêm filter vào wp_mail. Nếu theme của bạn làm điều này, nó có thể override thiết lập của plugin form. Hãy kiểm tra bằng cách chuyển tạm về theme mặc định.

Kết luận

Lỗi email HTML trong form WordPress là vấn đề phổ biến nhưng hoàn toàn có thể khắc phục được nếu bạn nắm rõ nguyên nhân và áp dụng đúng phương pháp. Từ việc thêm filter đơn giản, cấu hình SMTP, sửa template đến can thiệp sâu bằng hook, mỗi giải pháp đều có ưu nhược điểm riêng. Điều quan trọng nhất là bạn cần kiểm tra kỹ trước khi thay đổi, ưu tiên backup dữ liệu và luôn cập nhật plugin. Với hướng dẫn chi tiết trong bài viết này, hy vọng bạn sẽ tự tin xử lý triệt để wordpress form email html lỗi, đảm bảo mọi thông tin khách hàng gửi đến đều hiển thị đẹp mắt và chuyên nghiệp.