Hướng dẫn cài đặt plugin Contact Form 7 cho người mới

Bạn là người mới và bạn đang tìm kiếm giải pháp chèn form liên hệ vào website của mình? Bất kỳ blog/website nào cũng cần phải có form liên hệ để khách hàng/ độc giả có thể liên hệ với bạn về các sản phẩm/dịch vụ mà bạn cung cấp. Trong bài viết này tôi sẽ hướng dẫn các bạn sử dụng plugin Contact Form 7 để tạo form liên hệ trong WordPress một cách dễ dàng mà không cần phải dùng để code. 

Trong các plugin tạo form liên hệ thì Contact Form 7 là một trong những plugin tạo form liên hệ phổ biến nhất dành cho WordPress. Mặc dù là một plugin nổi tiếng nhưng đối với những người mới thì việc thiết lập cho plugin này không hề dễ dàng. Trước đây khi mới tiếp xúc với WordPress, tôi cũng đã phải vất vả vật lộn tìm hiểu trong một thời gian mới có thể làm chủ được plugin mạnh mẽ này.

Vì thế tôi viết bài này để chia sẻ kinh nghiệm cài đặt và sử dụng dành cho những người mới. Tôi sẽ giới thiệu cách cài đặt, tạo một biểu mẫu mới và chèn nó vào trang web WordPress của bạn.

Sau khi đọc xong bài viết bạn sẽ có được cái nhìn tổng quan đối với plugin Contact Form 7. Và bạn sẽ có thể tạo ra các mẫu liên hệ đáp ứng nhu cầu sử dụng của mình.

Vì sao cần phải chèn form liên hệ vào website?

Có thể bạn sẽ tự hỏi vì sao tôi phải tạo form liên hệ. Chẳng phải trên blog/website của mình tôi đã cung cấp mọi thông tin cần thiết rồi sao. Tôi đã cung cấp địa chỉ email của mình cho khách hàng/độc giả của mình rồi. Nếu muốn họ có thể gửi mail cho tôi. Việc gì phải tạo form liên hệ cho tốn công.

Dưới đây là 3 lý do tại sao dùng form liên hệ lại tốt hơn là sử dụng email:

  • Chống Spam: Khi bạn công khai địa chỉ email của mình, có thể bạn sẽ phải đối mặt với nguy cơ thư rác. Việc sử dụng contact form sẽ hạn chế được rất nhiều thư rác.
  • Thông tin nhất quán: Khi gửi email cho bạn, hiếm khi khách hàng/độc giả cung cấp đầy đủ các thông tin mà bạn cần. Nhưng với contact form, bạn có thể yêu cầu khách hàng/độc giả nhập đầy đủ và chính xác các trường.
  • Tiết kiệm thời gian: Các biểu mẫu liên hệ có thể giúp bạn tiết kiệm được khá nhiều thời giờ. Ngoài lợi ích về tính thống nhất của thông tin, bạn còn có thể dùng contact form để thông báo cho khách hàng/độc giả biết trước các bước tiếp theo là gì. Ví dụ như xem video quảng cáo, hoặc chờ sau 24 giờ mới nhận được phản hồi chẳng hạn. Vì biết trước phải làm gì nên họ sẽ không gửi nhiều thắc mắc đến bạn.

Với 3 lý do trên bạn đã biết tại sao chúng ta lại phải dùng form liên hệ trên website WordPress của mình rồi đúng không? Một website không thể thiếu sự tương tác với người dùng và đó là lý do tại sao chúng ta phải sử dụng form liên hệ.

Các tính năng nổi bật của Contact Form 7

contact form 7

Với hơn 1 triệu lượt cài đặt và kích hoạt, Contact Form 7 đích thực là một plugin vô cùng nổi tiếng. Dưới đây là các tính năng hàng đầu của plugin này:

  • Tạo và quản lý nhiều biểu mẫu liên hệ
  • Dễ dàng tùy chỉnh các trường trong biểu mẫu
  • Thay đổi nội dung thư dễ dàng.
  • Hỗ trợ Askimet, Ajax, CAPCHA.
  • Có rất nhiều tiện ích của bên thứ 3 dùng để mở rộng tính năng.
  • Và quan trọng nhất là nó miễn phí.

Bạn đã biết được những tính năng nổi bật của plugin này cũng như những việc nó có thể làm trên website của bạn. Giờ chúng ta cùng tìm hiểu cách cài đặt plugin Contact Form 7.

Cài đặt plugin Contact Form 7

Để cấu hình cho plugin, việc đầu tiên bạn cần làm đó là cài đặt nó cho WordPress site của mình. Việc cài đặt plugin tương đối đơn giản. Bạn chỉ cần nhấp vào liên kết Plugins » Add New.

add new plugin

Trang Add Plugins sẽ hiện ra. Bạn nhập tên của plugin Contact Form 7 vào ô tìm kiếm. Sau khi plugin Contact Form 7 hiện ra, bạn nhấp vào nút Install Now để cài đặt.

add plugin contact form 7

Sau khi cài đặt xong, nhấp vào nút Active để kích hoạt plugin. Bạn sẽ thấy một menu mới có tên là Contact xuất hiện trong thanh menu điều hướng của WordPress Dashboard.

Nếu bạn là người mới chưa biết cách cài đặt plugin trong WordPress, hãy tham khảo bài viết này.

Contact-Form-7-menu

Cấu hình cho plugin Contact Form 7

Nhấp vào liên kết Contact » Contact Forms, trang Contact Forms sẽ xuất hiện. Tại đây bạn sẽ thấy trung tâm quản trị của plugin. Bạn có thể quản lý nhiều Contact Form. Bạn cũng sẽ nhìn thấy biểu mẫu liên hệ mặc định của Contact Form 7 có tên là Contact Form 1.

Contact-Form-1

Contact Form 1 chứa tất cả các trường cơ bản mà một biểu mẫu liên hệ cần có. Về cơ bản nó sẵn sàng để có thể sử dụng ngay. Bạn có thể sử dụng biểu mẫu này để chèn vào bài viết/trang nếu bạn muốn.

Nếu bạn không muốn sử dụng biểu mẫu có sẵn, bạn có thể tạo biểu mẫu mới cho mình. Để làm điều đó bạn nhấp vào Contact » Add New. Trang Add New Contact Form sẽ xuất hiện.

Tạo một form liên hệ mới

Tại trang Add New Contact Form, bạn nhập vào tên của form liên hệ mới. Tại thẻ Form, mặc định plugin này cung cấp cho bạn các trường tên của bạn, địa chỉ email của bạn, chủ đề, thông điệp và nút gửi.

Add-New-Form

Tuy nhiên, bạn có thể chỉnh sửa biểu mẫu sao cho phù hợp với nhu cầu sử dụng của mình. Để làm điều đó, bạn kích chọn các nút chức năng mà mình mong muốn. Ví dụ để thêm trường URL, tôi nhấp vào nút URL như hình bên dưới.

Add-URL-field

Nếu bạn muốn thêm nhãn cho trường, bạn có thể sao chép mã HTML từ các thẻ mặc định của plugin. Ví dụ: Khi tôi nhấp vào nút URL, Contact Form 7 đã tạo ra [url url-935]. Nếu bạn muốn thêm nhãn cho nó bạn chỉ cần để nhãn của nó nằm giữa cặp thẻ <label></label> là được.

Tương tự như thế, bạn có thể dễ dàng thêm các trường mở rộng khác theo nhu cầu của mình.

Hiện tại Contact Form 7 cung cấp các trường như sau:

  • Text: Trường này dùng để nhập văn bản thông thường như tên họ, địa chỉ chẳng hạn.
  • Email: Trường này dùng để nhập địa chỉ thư điện tử khách hàng, độc giả của bạn.
  • ULR: Trường dùng để nhập liên kết. Ví dụ như địa chỉ blog/website.
  • Tel: Viết tắt của từ telephone. Đây là trường khác hàng, độc giả của bạn dùng để nhập số điện thoại.
  • Number: Trường này dùng để nhập số.
  • Date: Trường riêng biệt để chọn ngày tháng, có tích hợp thêm tính năng chọn theo lịch.
  • Text area: Trường để nhập text, nhưng khung text to hơn. Thích hợp để làm form nhập nội dung liên hệ.
  • Drop-down menu: Trường chọn giá trị được định sẵn thông qua menu đổ xuống.
  • Checkboxes: Trường chọn giá trị định sẵn thông qua việc kích chọn hộp kiểm.
  • Radio buttons: Cũng là trường đánh dấu giá trị có sẵn nhưng chỉ được chọn 1.
  • Quiz: Trường nhập nội dung theo kiểu quiz (trắc nghiệm).
  • reCAPTCHA: Trường nhập mã captcha kiểm tra, nếu nhập đúng thì mới có thể gửi biểu mẫu liên hệ.
  • File: Trường cho phép upload tập tin khi gửi liên hệ qua form này.
  • Submit: Chèn nút gửi (SEND) liên hệ.

Sau khi hoàn thành xong việc tạo form đừng quên nhấp vào nút Save để lưu lại.

Thiết lập quản lý các thông báo qua email

Sau khi tạo form liên hệ mới xong rồi, việc quan trọng bạn cần phải làm là đi đến thẻ Mail để cấu hình cho nó. Contact Form 7 cho phép bạn chỉnh sửa các mẫu email rất linh hoạt. Bạn có thể chỉnh sửa cả tiêu đề lẫn nội dung thư và tất cả các trường khác.

contact form 7 mail setup

Chúng ta hãy tìm hiểu các trường trong thẻ Mail:

  • To: Tất cả các biểu mẫu liên hệ sẽ được gửi vào địa chỉ mà bạn nhập tại trường này. Bạn có thể sử dụng bất kỳ địa chỉ email nào mà mình muốn. Tất nhiên nó phải là địa chỉ email của bạn.
  • From: Máy chủ sẽ sử dụng địa chỉ email này để gửi cho bạn form liên hệ. Đây phải là một địa chỉ email hợp lệ có sẵn.
    • Nếu dịch vụ thư dùng cho miền của bạn được cấu hình trong cPanel, hãy để mặc định.
    • Nếu tên miền của bạn sử dụng địa chỉ email cá nhân, bạn cần phải sử dụng phương thức gửi SMTP bằng cách cài đặt và cấu hình một trong các plugin SMTP.
  • Subject: Đây là chủ đề của biểu mẫu. Nếu bạn để trống, nó sẽ lấy chủ đề mà người dùng nhập vào.
  • Additional headers: Tại đây bạn có thể chỉ định tiêu đề email sẽ được thêm vào form liên hệ. Ví dụ: Trường Reply-To được thêm vào một cách mặc định cho phép bạn phản hồi tại địa chỉ email của khách truy cập bằng cách nhấp vào nút Reply (Trả lời).
  • Message Body: Thêm các thẻ mở rộng cho form liên hệ của bạn. Bạn có thể tùy chỉnh sao cho phù hợp với phong cách của mình. Và quan trọng là khi bạn nhận được email từ form liên hệ, bạn sẽ có được tất cả các thông tin cần thiết từ khách truy cập.
  • File attachments: Bạn có thể bật tính năng đính kèm tập tin cho form liên hệ của mình. Nó cho phép người dùng có thể gửi kèm tập tin thông qua form liên hệ. Nếu bạn không muốn sử dụng tính năng này hãy để trống. Nếu muốn đính kèm tập tin, hãy chèn shortcode vào. Ví dụ: [file file-123 limit:2m filetypes:png|jpg|jpeg|pdf]. Trong ví dụ trên bạn có thể chỉ định kiểu tập tin và kích cỡ của nó khi đính kèm.

Tùy chỉnh thông báo đến khách hàng/độc giả

Bạn có thể gửi các thông báo đến khách truy cập theo như mặc định hoặc tùy chỉnh chúng theo ý muốn của mình. Việc này tương đối trực quan. Bạn chỉ cần thay các thông báo bằng tiếng Anh sang tiếng Việt là được.

Nhấp vào thẻ Message, xóa các thông báo mặc định và thay thế bằng nội dung thông báo mà bạn muốn.

Ví dụ: Bạn có thể thay thế thông báo “Thank you for your message. It has been sent” bằng thông báo “Cảm ơn [your- name] thông điệp của bạn. Nó đã được gửi đi” chẳng hạn. Thẻ [your-name] sẽ lấy giá trị là tên của khách truy cập và hiển thị nó. Nhấp vào nút Save để lưu lại.

contact form 7 messeage

Thêm mã Capcha

Thường thì thêm mã Capcha không cần thiết cho lắm vì nó sẽ gây khó chịu cho độc giả/khách hàng của bạn. Tuy nhiên nó lại là biện pháp hiệu quả dùng để chống spam trên trang liên hệ của bạn.

Bạn nhấp vào liên kết Contact » Integration, trang Integration with Other Services sẽ xuất hiện.

Intergration Capcha in contact form 7

Để lấy khóa reCAPCHA, bạn vào địa chỉ này. Nhấp vào nút Get reCAPCHA sau đó dùng tài khoản Gmail để đăng nhập. Nhập tên vào trường Label. Chọn kiểu CAPCHA mà bạn muốn, nhập tên miền, kích chọn Accept the reCAPTCHA Terms of Service để đồng ý với các điều khoản của Google. Sau đó nhấp vào nút Register.

Sau khi đăng ký xong, dán shortcode của trường reCAPCHA trước nút Submit. Sau này khách hàng/độc giả của bạn muốn gửi form liên hệ họ sẽ phải nhập chính xác mã Capcha trước khi gửi.

Chèn form liên hệ vào bài viết, trang

Bạn đã biết cách cài đặt, cấu hình, tạo form liên hệ mới cũng như cấu hình mail cho contact form trên trang web của mình. Bước cuối cùng cần phải làm là chèn nó vào bài viết/trang.

Nhấp vào liên kết Contact » Contact Forms để chọn form liên hệ mà bạn muốn chèn vào bài viết hoặc trang trên website WordPress của mình. Sau đó copy shortcode của form.

Chèn form liên hệ vào bài viết hoặc trang

Mở bài viết hoặc trang mà bạn muốn chèn form liên hệ. Dán shortcode của form liên hệ vào vị trí bạn muốn nó hiển thị.

Xem trước kết quả của bài viết/trang. Nếu bạn thấy hài lòng nhấp vào nút Publish để xuất bản.

Sau khi đã xuất bản form liên hệ, bạn cần kiểm tra thử xem nó có hoạt động tốt hay không. Nếu mọi thứ đều ổn form liên hệ của bạn sẽ gửi trực tiếp các thông tin đến địa chỉ email mà bạn đã cấu hình trong thể Mail. Nếu hộp thư của bạn vẫn trống rỗng, hãy kiểm tra mục thư rác trước khi bắt đầu khắc phục lỗi không gửi được mail trong Contact Form 7.

Tổng kết

Form liên hệ là một trong những phần quan trọng của website. Nó giúp cho sự tương tác, liên hệ giữa bạn và khách hàng/độc giả trở nên dễ dàng và hiệu quả hơn. Sau khi đọc xong bài viết này bạn đã biết cách cài đặt, cấu hình, tạo một form liên hệ mới cho website WordPress của mình. Trong tương lai không xa, bạn có thể thêm các tính năng mở rộng cho form liên hệ của mình bằng cách sử dụng các phần mở rộng của bên thứ 3. Bạn có thể tham khảo các plugin dùng để mở rộng tính năng cho Contact Form 7 tại đây.

Nếu bạn thấy bài viết này hữu ích đừng quên Like và Share!

Hẹn gặp lại bạn trong các bài viết tiếp theo.

Đăng ký nhận bài viết mới nhất

Hãy đăng ký nhận tin để nhận được những nội dung thú vị và tuyệt vời!

Để lại bình luận

Plugins Themes Thủ thuật
Hướng dẫn thêm icon vào menu điều hướng trong WP
Hướng dẫn thêm icon vào menu điều hướng WordPress
Hướng dẫn thêm menu điều hướng cho wordpress site
Hướng dẫn thêm menu điều hướng trong WordPress
15 .htacess snippet hay
15 .htaccess snippet hữu ích cho WordPress site
Keyword Research SEO Offpage SEO Onpage
Từ khoá và website của bạn
Xây dựng Website chuẩn SEO
Xây dựng Website chuẩn SEO
Hướng dẫn chi tiết WordPress SEO
Hướng dẫn chi tiết WordPress SEO cho người mới
Ajax Bootstrap HTML/CSS JavaScript Joomla jQuery PHP/MySQL
Cách đặt tên miền
Tên miền là gì? Cách chọn tên miền cho blog WordPress
Thay đổi tên miền cho website wordpress
Hướng dẫn thay đổi tên miền cho website WordPress
Sự khác nhau giữa tên miền và Web Hosting
Sự khác nhau giữa tên miền và Web Hosting
Amazon Nichesite Google Adsense Product Lauch Social Marketing Viết Blog Youtube Partner
Thêm Google Adsense vào trang web WordPress
Hướng dẫn thêm Google Adsense vào trang web WordPress
Hướng dẫn đăng ký tài khoảnClickbank khi bị chặn ở Việt Nam
Hướng dẫn đăng ký tài khoản Clickbank khi bị chặn tại Việt Nam
Kiếm tiền từ blog WordPress
Kiếm tiền từ blog WordPress như thế nào?