Hướng dẫn tạo form liên hệ dùng plugin Contact Form 7 cho WordPress

Việc thiết lập Form liên hệ cho website là một việc mà quản trị web cần làm ngay khi cài đặt thành công website/blog. Vì Form liên hệ sẽ giúp đọc giả, khách hàng dễ dàng liên hệ với bạn bất cứ khi nào ngay trên website, giúp tăng kết nối với khách hàng tiềm năng.

Trong bài viết này Hòa sẽ hướng dẫn chi tiết cách tạo Form liên hệ chuyên nghiệp bằng cách sử dụng plugin Contact Form 7. Đây là một plugin phổ biến và được rất nhiều người sử dụng, hiện lượt tải về đã lên đến hơn 1 triệu.

Bước đầu tiên hãy cần cài đặt plugin contact form 7. Xem hướng dẫn cài đặt plugin chi tiết.

Hướng dẫn tạo form với Contact Form 7 trong wordpress

Sau khi cài đặt thành công plugin contact form 7. Kích hoạt plugin lên bạn sẽ thấy một menu mới là Contact.

Để tạo form bạn vào mục Contact -> Add New

Hướng dẫn tạo form liên hệ

Một cửa sổ mới mở ra. Đầu tiên bạn cần nhập tiêu để cho form càn tạo. Ý nghĩa của tiêu đề giúp bạn phân biệt các form khác nhau để dễ dàng quản lý.

Chuyển sang tab Form ta thấy tất cả các trường được liệt kê ở đây, mỗi trường có chức năng riêng. Có một số trường phổ thông hay dùng đã dược chèn sẵn ở khu vực phía dưới

Cá trường có ý nhgĩa như sau:

  • Text: Đây là trường ký tự thông thường, thích hợp cho nhập tên, tiêu đề…
  • Email: Trường email để khách hàng nhập email liên hệ để bạn có thể phản hồi đến khách hàng.
  • URL: Dùng để nhập đường dẫn bài viết, liên kết website
  • Tel: Trường này dùng để nhập số điện thoại
  • Number: Trường nhập số nhưng có thêm tính năng tạo nút tăng/ giảm số.
  • Date: Trường dùng để chọn ngày tháng, và có tích hợp thêm tính năng chọn theo lịch.
  • Text area: Trường để nhập ký tự, nhưng có khu vự rộng hơn to hơn phù hợp đẻ làm form nhập nội dung của liên hệ
  • Dropdown menu: Đây là trường chọn giá trị được mặc định sẵn thông qua menu sổ xuống.
  • Checkboxes: Trường đã tạo sẵn ô chọn, người dùng sẽ chọn ô chọn bằng cách đánh dấu.
  • Radio buttons: Cũng là trường đánh dấu giá trị có sẵn nhưng chỉ được lựa chọn một ô
  • Quiz: Trường nhập nội dung theo kiểu quiz.
  • Captcha: trường này là dùng để nhập mã captcha để kiểm tra, nếu nhập đúng thì mới có thể gửi form
  • File upload: trường cho phép upload tập tin khi gửi liên hệ qua form này.
  • Submit button: chèn nút gửi form

Để thêm một trường bất kỳ nào vào form liên hệ bạn chỉ cần nhấn vào trường đó. Khi đó một ô cửa sổ sẽ hiện ra, bạn có thể đặt tên cho trương, tick chọn ô Required field nếu yêu cầu bắt buộc cần nhập mới gửi được. (ví dụ hình bên dưới là field nhập số điện thoại)

Nhấp Insert Tag để chèn field vào form liên hệ

Hướng dẫn tạo form liên hệ

Sau khi nhấn Insert Tag thì trường số điện thoại đã được thêm vào như hình dưới đây

Hướng dẫn tạo form liên hệ

Và sau khi đã thêm, bớt các trường theo nhu cầu của web thì hãy chuyển qua tab MailTại đây bạn cần copy các đoạn shortcode của trường mà muốn nhận khi khách hàng gửi mail về cho bạn đưa vào ô Message Body.

Trong hình dưới đây là có copy đoạn shortcode [MobiPhone] để đưa vào khu vực Message Body, khi khách hàng gửi thông tin thì bạn sẽ nhập được số điện thoại và nội dung thông điệp trong email

Lưu ý: Khung TO bạn cần nhập địa chỉ email muốn các form sẽ gửi về.

Hướng dẫn tạo form liên hệ

Nhớ nhấp Save sau mỗi lần cài đặt.

Bây giờ chuyển qua tab Messages. Tại tab này bạn hãy chuyển ngữ các thông tin tiếng anh sang tiếng việt. Các thông điệp này sẽ hiện ra khi khách hàng thao tác gửi form. Nhớ lưu lại

Hướng dẫn tạo form liên hệ

Bướ này bạn cần copy đoạn shortcode màu xanh của form đã tạo.

Hướng dẫn tạo form liên hệ

Tạo một trang liên hệ, hay một bài viết nào đó mà bạn muốn. Sau đó dán doạn code ở trên vào, như hình dưới đây. Sau đó nhấn Publish

Hướng dẫn tạo form liên hệ

Khi mở trang hay bài viết có chứa đoạn code ở trên bạn sẽ có được một form liên hệ nhìn như thế này.

Hướng dẫn tạo form liên hệ

Vậy là toàn bộ thiết lập tạo Form liên hệ cho web đã hoàn thành. Sau khi khách hàng điền form liên hệ và gửi, bạn sẽ nhận được nội dung email như hình bên dưới.

Hướng dẫn tạo form liên hệ

Thành quả nhìn rất chuyên nghiệp đúng không? Bạn có thể dùng Form này để thêm, bớt các trường tùy theo mục đích sử dụng của mổi loại Form khác nhau.

Trong trường hợp không gửi được Form liên hệ.

Nếu gặp vấn đề không gửi được email qua Form thì là do nhà cung cấp host của bạn đã chặn hàm gửi mail, vì vậy Hòa khuyến khích các bạn nên dùng các host mà chúng tôi đề xuất tại đây. Đây là dịch vụ hosting tốt nhất cho WordPress và họ hỗ trợ chức năng gửi mail rất tốt, bản thân website XuanHoaBlog.com cũng sử dụng dịch vụ hosting này.

Có thể bạn cần: Tạo email tên miền riêng trên hosting sử dụng cPanel

Vậy là toàn bộ hướng dẫn cách tạo form liên hệ trong web/blog WordPress sử dụng plugin Contact Form 7 đã hoàn thành. Bạn có thể áp dụng để tạo form giúp giao tiếp tốt nhất và nhanh nhất với khách hàng, đọc giả trên blog của mình.

Chúc bạn thành công!

Comments (No)

Leave a Reply