Lỗi Contact Form 7 & cách khắc phục

Khi bạn thiết kế website bằng WordPress thì Contact Form 7 là plugin không thể thiếu để tạo form trên website. Contact Form 7 có hỗ trợ cấu hình thông báo lỗi & xác minh tính hợp lệ trường. Nó giúp định hướng tốt người dùng & nhận các phản hồi một cách chính xác. Dưới đây là những lỗi phổ biến thường gặp khi sử dụng contact form 7.

Xung đột tên trường

Có một số tên bạn tránh sử dụng khi đặt tên trường, vì WordPress có sử dụng tham số riêng để truy vấn dữ liệu & bạn không nên sử dụng các tên biến này. Mặc định Mỗi form có chứa các trường ẩn chuyên biệt để sử lý dữ liệu trong contact form 7. Các trường này không thể thay thế !

Để khắc phục cách tốt nhất bạn tránh sử dụng tên đặc biệt để đặt cho tên trường của bạn hoặc thêm tiền tố /hậu tố để không trùng với bất kỳ trường nào. Ví dụ: sử dụng tên như ‘your-name’ hoặc ‘name-1234’ thay vì ‘name’

Dùng label cho multi-select checkbox

Lỗi này xẩy ra khi form có ít nhất một label mà chứa từ 2 trường form trở lên. Lưu ý: Một thẻ label chỉ sử dụng để mô tả cho một trường duy nhất.

Ví dụ sau sẽ không hợp lệ khi bạn bao thẻ label với trường checkboxes hoặc radio buttons.

<label>[checkbox your-country "China" "India" "San Marino"]</label>

Contact form 7 có tích hợp label cho các trường đa lựa chọn này. Do vậy nếu bạn sử dụng cách như trên là không hợp lệ.

Trường trống?

Kiểu lỗi này bạn hay thấy trong trường Subject hoặc Message ở tab mail. Điều đó cho biết trường không chứa nội dung.

Đừng quên điền vào giá trị này trên form, nếu lỗi này lặp lại không thể chỉ đánh dấu spam cho mail của bạn mà rất có thể tạo ra lỗi gửi email trong WordPress trên một số hosting.

Nếu bạn sử dụng trường mail, đảm bảo tồn tại giá trị & không chứa ký tự cách thậm trí được sử dụng từ giá trị nhập bởi người dùng.

Giả sử bạn có trường Subject, có chứa thẻ tag như sau [your-subject]:

Subject: [your-subject]

Như bạn có thể thấy giá trị này sẽ thay thế bởi trường your-subject & sử dụng cho tiêu đề mail khi người dùng nhấn nút gửi Form. Do đó hãy đảm bảo giá trị này không rỗng.

Tuy nhiên, nếu người dùng để trống trường, tiêu đề email sẽ không tồn tại. Để khắc phục lỗi này bạn có thể thiết lập mặc định yêu cầu bắt buộc điền cho trường bằng cách thêm *

 // Optional text field => Not good
 // Required text field => Good

hoặc thêm một vài nội dung đi kèm thẻ tag.

Subject: You got a message "[your-subject]"

Sai cú pháp mailbox

Lỗi này xảy ra với trường To/From trong tab Mail. Cũng được biết đến như phần header trong mail. mailbox là một chỉ email, vd [email protected]

Một định dạng khác chứa tên và email được bao bởi cặp ký tự < >. VD:

John Smith [email protected]

Nhưng nếu định dạng mailbox theo cách này thì sai:

John Smith [email protected]

Bạn cũng có thể thêm nhiều mailbox, và nó cách nhau bởi dấu phẩy.

John Smith <[email protected]>, John Smith Jr. <[email protected]>

Bên cạnh đó, Bạn có thể sử dụng tag trong mailbox nhưng hãy thận trọng. Khi bạn sử dụng tag trong phần email của mailbox, cần đảm bảo trường tag đó luôn chứa giá trị là email.

Email người gửi không theo tên miền

Lỗi này sẩy ra ở tab Mail nếu giá trị trường To/From hợp lệ (mailbox) nhưng địa chỉ email không theo tên miền website

Mail header không lệ

Bạn thiết lập lỗi ở Tùy chọn “Additional Headers” ở tab Mail khi nhập sai định dạng cho phần mail header.

Mail header được cấu thành gồm tên, theo sau bởi dấu (:) và email. Xem 2 VD sau:

# giá trị sau hợp lệ
Cc: [email protected]
Reply-To: [email protected]

# giá trị sau không hợp lệ
Cc [email protected] // thiếu :
Reply To: [email protected] // có ký tự cách "Reply To"

Tệp định lèm không tồn tại

Lỗi này sẩy ra với trường upload file, khi bạn thiết lập đường dẫn file không tồn tại. Lỗi này có thể gây hoang mang, và làm bạn khó hiểu vì bạn cần phân biệt ‘absolute path’ và ‘relative path’. Nếu tên file có chứa ký tự đầu tiên ‘/’ đó là absolute path. Nếu bạn sử dụng relative path, file sẽ bắt đầu từ thư mục wp-content

Không cho phép tạo files ngoài thư mục wp-content? đúng vậy. Bạn có thể nhận được thông báo lỗi do một hay nhiều files trong trường `File Attachments` có chỉ định sai đường dẫn. VÌ lý do bảo mật contact form 7 không cho phép tạo file ngoài thư mục wp-content.

Bạn vẫn có thể tạo file trong thư mục wp-content hoặc tạo một thư mục con để chứa files tải lên.

Ngoài ra, chặn định dạng file trong WordPress cũng là một nguyên nhân.

Ký tự HTML trong tin nhắn lỗi?

Lưu ý bạn không được phép sử dụng ký tự HTML trong nội dung thông báo lỗi.

Sử dụng cấu hình không được hỗ trợ

Cài đặt ‘on_sent_ok’ và ‘on_submit’ đã bị loại bỏ từ năm 2017. Nếu bạn sử dụng tùy chọn này trong mục Additional Settings, vui lòng thay thế bằng sự kiện DOM HTML.

Spam mail

Nếu email gửi đi từ contact form, bạn nhận được email này từ dịch vụ mail nhưng trong mục spam. Bạn có thể cấu hình email template cho contact form 7 như thế này:

From: [your-name]
Email: [your-email]
Message: [your-message]
 
----
This e-mail was sent from a contact form on (http://domain.com)

Bạn có thể thấy mẫu form trên không có nội dung email, như vậy khi gửi đi cho một ai đó liên tục email của bạn sẽ bị coi là spam.

Không thể gửi email với SMTP

Cách thông dụng nhất khi gửi email đi từ web server trên website của bạn là sử dụng SMTP. Xem chi tiết cách cấu hình gửi email với SMTP.Tuy nhiên trong trường hợp nếu lưu trữ hosting của bạn chặn cổng SMTP bạn vẫn có thể gửi email thông qua dịch vụ API khác như sendgrid, sendinblue,..

Trước tiên, bạn cần tắt gửi mail trong contact form 7. Thêm dòng này vào functions.php

function my_skip_mail($f){
    $submission = WPCF7_Submission::get_instance();
    return true; // DO NOT SEND E-MAIL    
}
add_filter('wpcf7_skip_mail','my_skip_mail');

Có rất nhiều dịch vụ mail miễn phí, một trong số đó mình sử dụng Mailgun . Mailgun là dịch vụ gửi mail miễn phí, với tài khoản cơ bản bạn có thể gửi 10,000 email mỗi tháng.

Bạn có thể tải thư viện mailgun PHP tại đây. Chúng ta sẽ chèn code gửi mail với mailgun trong khi người dùng nhấn submit form. Contact form 7 cho bạn tùy biến linh hoạt, trong số đó có hook wpcf7_before_send_mail, bạn có thể sử dụng hook này để gửi email từ server riêng. Để thực hiện, bạn thêm đoạn code sau vào file functions.php

add_action( 'wpcf7_before_send_mail', wpcf7_sendEmailByAPI );

function wpcf7_sendEmailByAPI( $cf7 ) {
    // get the contact form object
    $wpcf7 = WPCF7_ContactForm::get_current();

    // do not send the email
    $wpcf7->skip_mail = true;

    # Include the Autoloader (see "Libraries" for install instructions)
	require 'vendor/autoload.php';
	
	# Instantiate the client.
	$mgClient = new Mailgun\Mailgun('405266168726e24048c5bfb1e7cb1f06-4525e19d-38691604');
	$domain = "sandboxc95aa410d7f84bd7ac3fcc1b23469fe1.mailgun.org";

	# Make the call to the client.
	$result = $mgClient->sendMessage("$domain",
			  array('from'    => 'Mailgun Sandbox <[email protected]>',
					'to'      => 'Hoang Quach <[email protected]>',
					'subject' => 'Hello Hoang Quach',
					'text'    => 'Congratulations Hoang Quach, you just sent an email with Mailgun!  You are truly awesome!'));

}

Lưu ý: thay mailgun API của bạn trên tài khoản mailgun.

Nếu bạn thấy bài viết này hữu ích, hãy chia sẻ với bạn bè bằng cách nhấn nút chia sẻ ở bên dưới. Theo dõi chúng tôi trên Twitter và Facebook