Hướng dẫn sử dụng contact form 7 với nội dung chi tiết nhất

Trong bài viết này mình sẽ từng bước hướng dẫn sử dụng contact form 7 cho các bạn để có thể tạo được một form liên hệ chuyên nghiệp theo nhu cầu của riêng bạn.

Tại sao bạn cần sử dụng plugin contact form 7

Bạn nên sử dụng Contact form 7 bởi:

• Là một trong những thành phần không thể thiếu của một Website: độc giả ghé thăm website dùng contact form 7 để dễ dàng liên hệ với bạn khi có nhu cầu mang tính chất riêng tư.
• Tính đến thời điểm viết bài đã có hơn 5 triệu lượt người sử dụng plugin contact form 7, một trong những form liên hệ miễn phí phổ biến nhất hiện nay.
• Tuy giao diện khá đơn giản nhưng được đánh giá là một plugin tạo form liên hệ có khả năng tùy biến cao bởi sử dụng chính CSS có trong theme WordPress.
• Đảm bảo tính bảo mật thông tin: Với nội dung form là riêng tư nên chỉ có người gửi và người nhận mới có thể xem thư.
• Ngoài ra, Contact form 7 có khả năng tùy biến cao mà những plugin trả phí khác không có.

Hướng dẫn sử dụng contact form 7

Đầu tiên, bạn tiến hành cài đặt plugin Contact form 7, sau đó kích hoạt để sử dụng.

Trường hợp bạn là người mới thì có thể tham khảo bài viết hướng dẫn cài đặt plugin tại đây.

Theo mặc định, plugin contact form 7 sẽ sử dụng địa chỉ email quản trị của bạn để sử dụng cho việc nhận thư liên hệ của người gửi.

Để tạo một form liên hệ mới. Tại Menu Contact bạn kích vào Add New.

Khi giao diện tạo mẫu liên hệ hiện lên bạn cần điền thông tin tiêu đề cho form cần tạo để dễ dàng cho việc quản lý form cũng như phân biệt giữa chúng.

Thiết lập Form cho người liên hệ

Trong giao diện bạn sẽ thấy Tab Form là thông tin các trường được liệt kê và bên dưới là một số trường đã được tạo mặc định sẵn cho bạn.

Trong đó:

• Text: trường nhập chữ cho tên tiêu đề, liên hệ
• Email: trường để nhập email liên hệ của người đọc
• URL: trường cho phép nhập link
• Tel: nhập thông tin số điện thoại
• Number: nhập giá trị đầu vào là số
• Date: trường cho phép chọn ngày/tháng/năm
• Text are: cho phép nhập định dạng text với khung hiển thị lớn hơn
• Drop-down menu: cho phép chọn giá trị định sẵn với menu thả
• Checkboxes: trường cho phép dùng nút kiểm check
• Radio buttons: cho phép chọn một giá trị có sẵn
• Acceptance: hộp kiểm chấp nhận để xác nhận sự đồng ý của người gửi với một điều kiện nào đó.
• Quiz: khai báo nội dung theo mẫu Quiz
• File: cho phép upload file kèm theo nội dung
• Submit:chèn một nút gửi

Khi bạn đã hiểu ý nghĩa của các trường thì có thể thêm các trường đó vào mẫu liên hệ tùy theo mục đích của bạn.

Bạn tích vào trường cần thêm sau đó tiến hành đặt tên cho trường tại mục Name. Bạn có thể yêu cầu bắt buộc phải nhập thông tin trường này bằng cách nhấn kiểm vào Required field. Trường hợp không bắt buộc đối với người liên hệ thì bạn không cần kiểm vào nó.

Ví dụ: Kết quả thu được với hướng dẫn sử dụng contact form 7 khi thêm trường yêu cầu nhập số điện thoại như hình dưới

Thiết lập form nhận thông tin từ người liên hệ

Để bạn có thể nhận được những thông tin liên hệ mà bạn đã thêm Field trước đó khi người gửi điền và gửi cho bạn thì bạn cần vào Tab Mail để thiết lập.

Bạn cần khai báo Field vừa thêm bước trên vào trong ô Message Body phía bên dưới như hình.

Dịch ngôn ngữ hiển thị cho Contact form 7

Bạn muốn ngôn ngữ form liên hệ của mình hiển thị Tiếng Việt thì bạn cần vào Menu Messages để tiến hành thay đổi ngôn ngữ hiển thị như hình dưới.

Bạn có thể coppy các câu bằng tiếng Anh đó rồi sử dụng Google dịch để thay đổi sang Tiếng Việt rồi dán lại vào đó. Rất đơn giản phải không nào.

Thiết kế Contact form 7 với mã CSS tùy chỉnh

Để có một giao diện form liên hệ đẹp hơn như thay đổi font chữ cũng như màu sắc của form liên hệ mới. Bạn tiếp tục vào Menu Additional Settings. Tại đây, bạn có thể thêm các mã CSS tùy chỉnh vào đó.

Trong bài viết hướng dẫn sử dụng contact form 7 này thì phần chỉnh sửa CSS nâng cao này bạn cần phải biết một chút về Code để thiết kế theo tùy biến của mỗi người nên mình sẽ không đưa ra ví dụ. Trường hợp bạn muốn tham khảo để tùy biến thì có thể truy cập tại đây để xem hướng dẫn.

Chèn form liên hệ

Sau khi bạn hoàn tất việc tạo một form liên hệ theo tùy biến riêng của mình. Bạn cần coppy đoạn mã Shortcode để dán vào trong bài viết hoặc trang Liên hệ của mình.

Bạn thực hiện việc Test thử bằng cách điền thông tin vào form liên hệ bạn vừa tạo rồi vào email để check những thông tin theo cấu hình tùy chỉnh cho contact form 7 của mình.

Sửa lỗi khi không gửi form liên hệ

Trong phần hướng dẫn sử dụng contact form 7 này bạn sẽ bị vướng việc Test gửi email và nhận email thì có thể do hosting của bạn không hỗ tính năng này. Do đó bạn cần tham khảo các bài viết sau để có thể khắc phục được nhé.

• Sửa lỗi không gửi được email trong wordpress 1 cách chi tiết
• Tạo email tên miền riêng với yandex miễn phí update năm 2019
• Hướng dẫn tạo email tên miền riêng với zoho miễn phí 100%

Trên đây là hướng dẫn sử dụng contact form 7 để tạo form liên hệ giúp cho việc kết nối thông tin giữa người đọc và bạn. Nếu bạn thây Blog của mình có ích hãy ủng hộ mình bằng việc thường xuyên ghé qua nhé. Chúc các bạn thành công!