Hướng dẫn chi tiết cách cấu hình email trong contact Form 7 để nhận được email thông báo khi khách hàng hoàn tất form liên hệ.

Nếu bạn chưa biết về Contact Form 7, vui lòng đọc qua bài này: Tài liệu sử dụng thành thạo Contact Form 7 (CF7)

Bài viết này giúp khắc phục lỗi liên quan tới contact form 7 không gửi được email và không nhận được mail từ contact form 7 sau khi khách hàng submit form.

Mặc nhiên, WordPress không thể tự gửi email được, điều này khiến cho tính năng gửi email của Contact Form 7 bị lỗi: “Bạn gửi tin nhắn không thành công. Hãy liên hệ với quản trị viên để được hỗ trợ”.

Báo lỗi khi người dùng gửi phản hồi (Ảnh: muatheme.com)

Lỗi 1: 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’.

Lỗi 2: 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ệ.

Lỗi 3: 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]"

Lỗi 4: Không thể gửi email với SMTP

Cách 1 – Không dùng plugin

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 <postmaster@sandboxc95aa410d7f84bd7ac3fcc1b23469fe1.mailgun.org>',
                    'to'      => 'CUNG HOC WEB <info@cunghocweb.com>',
                    'subject' => 'Hello Cung Hoc Web',
                    'text'    => 'Congratulations Cung Hoc Web, 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.

Cách 2: Dùng Plugin

Bạn cài plugin WP SMTP tại đây, sau đó vào hosting, dùng 1 email hoặc tạo 1 email mới với tên miền của web, ví dụ đây chúng ta có email info@cunghocweb.com sau đó truy cập vào phần Mail Client Manual Settings trong hosting:

Sau đó phần Test your settings, nhập email nhận, tiêu đề và nội dung để test email xem có hoạt động chưa. Nếu thấy thông báo màu xanh Message sent! là đã thành công.

Trên đây một vài lỗi thông dụng và thường gặp nhất, các bạn có thắc mắc vấn đề gì cứ gửi email đến chúng tôi, chúng tôi sẽ có bài viết hoặc cập nhật phản hồi của các bạn sau.