Xu Hướng 12/2023 # Hướng Dẫn Tạo Form Liên Hệ Trong WordPress Với Contact Form 7 # Top 20 Xem Nhiều

Bạn đang xem bài viết Hướng Dẫn Tạo Form Liên Hệ Trong WordPress Với Contact Form 7 được cập nhật mới nhất tháng 12 năm 2023 trên website Rafs.edu.vn. Hy vọng những thông tin mà chúng tôi đã chia sẻ là hữu ích với bạn. Nếu nội dung hay, ý nghĩa bạn hãy chia sẻ với bạn bè của mình và luôn theo dõi, ủng hộ chúng tôi để cập nhật những thông tin mới nhất.

Tạo form liên hệ trong WordPress là một việc mà gần blogger nào cũng cần phải làm ngay sau khi cài đặt thành công blog/website. Form liên hệ sẽ giúp người đọc, khách hàng dễ dàng liên gửi thông tin liên hệ với bạn bất cứ lúc nào ngay trên website.

Bài viết này Ngọc sẽ hướng dẫn bạn cách tạo form liên hệ chuyên nghiệp bằ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.

Việc đầu tiên bạn cần là cài đặt plugin contact form 7, tham khảo cách cài đặt một plugin chi tiết.

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

Trong tab Form bạn sẽ thấy tất cả cá field được liệt kê. Một số field thường dùng đã được chèn sẵn.

Text: Trường dùng để bạn nhập text thông thường, thích hợp tạo field nhập tên, tiêu đề liên hệ,…..

Email: Trường đặc biệt dùng để khách hàng nhập email của họ vào, lúc đó các hệ thống email sẽ hiểu rằng đây là email của người liên hệ để bạn có thể reply nhanh chóng.

URL: Trường dùng để nhập liên kết.

Tel: Một trường đặc biệt để nhập số điện thoại.

Number: Trường nhập số có thêm tính năng tạo nút tăng/giảm 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ệ.

Dropdown 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 đánh dấu. (tick chọn)

Radio buttons: Cũng là trường đánh dấu giá trị có sẵn nhưng chỉ được chọn 1 giá trị

Quiz: Trường nhập nội dung theo kiểu quiz.

CAPTCHA: Trườ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.

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

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

Bây giờ tiếp tục chuyển qua tab Messages. Tại đây bạn cần dịch 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.

Vấn đề không gửi được form liên hệ

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

Tạo Form Liên Hệ Trong WordPress Dễ Dàng Với Contact Form 7

Trước đây mình đã có hướng dẫn tạo form liên hệ (hoặc bất cứ form nào) với plugin JetPack. Nhìn chung nó cũng rất chuyên nghiệp và dễ sử dụng, tuy nhiên có khá vấn đề bất cập nếu bạn làm theo cách này bởi vì đầu tiên là bạn cần phải cài plugin JetPack, thứ hai là nó khó tuỳ biến nếu bạn có nhiều kiến thức về PHP, jQuery, HTML, CSS,….

Do vậy, mình sẽ cho bạn một giải pháp tạo form chuyên nghiệp hơn mà lại dễ dàng tuỳ biến, đó chính là dùng plugin chuyên tạo form hoàn toàn miễn phí mang tên Contact Form 7. Plugin này hiện tại được đánh giá là plugin tạo form có khả năng tuỳ biến vượt trội và nó có thể phục vụ được một số việc mà những plugin trả phí có khi không làm được. Mình sẽ hướng dẫn nhiều cách tuỳ biến với form này sau.

Cài đặt plugin Contact Form 7

Các bạn tiến hành cài plugin Contact Form 7 như thông thường và kích hoạt để sử dụng.

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

Sau khi ấn nút tạo form, bạn sẽ có được cửa sổ như sau:

Text field: Trường dùng để bạn nhập text thông thường, thích hợp tạo field nhập tên, tiêu đề liên hệ,…..

Email: Trường đặc biệt dùng để khách nhập email của họ vào, lúc đó các hệ thống email sẽ hiểu rằng đây là email của người liên hệ để bạn ấn reply nhanh chóng.

URL: Trường dùng để nhập liên kết.

Telephone Number: Một trường đặc biệt để nhập số điện thoại.

Number (spinbox): Trường nhập số có thêm tính năng tạo nút tăng/giảm số.

Number (slider): Trường chọn số đặc biệt, chọn theo kiểu kéo slide, kéo qua phải thì số tăng và kéo qua trái thì số giảm.

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ệ.

Dropdown 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 đánh dấu.

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.

CAPTCHA: Trườ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.

Quá nhiều lựa chọn phải không? Nhưng nhiêu đó chưa hết đâu, còn có thêm một số plugin hỗ trợ thêm nhiều loại field khác nữa mà mình sẽ đề cập ở một bài khác.

Để thêm một field bất kỳ, bạn ấn vào nút Generate Tag bên tay phải và chọn kiểu field cần tạo, khi ấn vào nó sẽ sổ ra bảng giá trị của field mà bạn có thể nhập (nếu hiểu) hoặc bỏ trống.

Bạn có thể thấy là mặc định họ cũng làm như thế, bởi vì làm như cách trên thì field của bạn sẽ có một cái tiêu đề nằm phía trên và phía dưới là field để nhập. Nhưng mà, bạn cũng có thể chỉnh theo kiểu gì đó mà bạn thích.

Song song với lúc đó, bạn cũng cần copy field trong khung màu xanh lá cây bỏ vào khung Message body của khung Mail phía bên dưới. Khung này có ý nghĩa là cài đặt mẫu các thư liên hệ mà khách gửi cho bạn qua form này. Nếu bạn không copy field màu xanh bỏ vào khung bên phải của phần Mail thì bạn sẽ không thể thấy nội dung mà khách nhập vào trong field đó.

Sau khi chỉnh xong, nhớ ấn nút Save.

3. Chèn form vào Post/Page

Cách chèn cực kỳ đơn giản, chỉ cần copy shortcode trong khung màu nâu ngay bên dưới tiêu đề form.

Và copy vào nội dung của post/page.

Và bạn sẽ có kết quả

Thêm trang cảm ơn cho Contact Form 7

Nếu bạn muốn thêm một trang cảm ơn mà nó sẽ tự động chuyển khách tới sau khi gửi thông tin xong thì bạn có thể cài plugin Contact Form 7 – Success Page Redirects.

Không gửi được được email?

Nếu bạ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 mình khuyến khích các bạn nên dùng các host tại trang 7 Shared Host tốt nhất cho WordPress vì mình chưa bao giờ gặp các lỗi này khi sử dụng các host đó.

Hoặc bạn có thể sử dụng SMTP để thiết lập server gửi mail riêng.

Nếu bạn dùng địa chỉ email dạng tên miền riêng mà không nhận được email thì xem bài này.

Không nhận được email?

Nếu bạn thấy form đã gửi email thành công mà bạn không thấy email trong inbox thì hãy kiểm tra mục Spam và đọc bài này để khắc phục.

Tạo Form Liên Hệ Trong WordPress Với Contact Form 7

Trong bài hôm nay mình sẽ chọn cho bạn một giải pháp tạo form chuyên nghiệp hỗ trợ nhiều ngôn ngữ (bao gồm tiếng việt) mà lại dễ dàng tùy biến, đó là plugin chuyên tạo form hoàn toàn miễn phí có tên Contact Form 7 . Plugin này hiện tại được đánh giá là plugin tạo form có khả năng tùy biến vượt trội và có thể làm được một số việc mà những plugin trả phí không làm được.

Cài đặt plugin Contact Form 7

Các bạn tiến hành cài đặt plugin Contact Form 7 như thông thường và kích hoạt để sử dụng.

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

Trước khi tạo form, bạn tiến hành chọn ngôn ngữ sử dụng trên form, ở đây chúng ta chọn ngôn ngữ tiếng việt “Vietnamese” từ danh sách rồi nhấn nút Add New. Hoặc nếu sử dụng mặc định ngôn ngữ tiếng anh thì nhấn Add New.

Sau khi nhấn nút tạo form, bạn sẽ có được cửa sổ như sau:

Text field: trường nhập text thông thường, như tạo field nhập têm, tiêu đề liên hệ,..

Email: trường đặc biệt dùng để khách nhập email của họ vào. Email này sẽ được các hệ thống email hiểu rằng đây là email của người liên hệ để bạn nhấn reply nhanh chóng.

URL: trường dùng để nhập liên hệ.

Telephone Number: dùng trường này để nhập số điện thoại.

Number (spinbox): trường nhập số có thêm nút tăng giảm số.

Number (slider): trường nhập số đặc biệt có dạng slider, chọn số bằng cách kéo thả slide.

Date: trường chọn ngày tháng, có thể chọn theo lịch.

Textarea: trường dùng để nhập một đoạn text có nhiều dòng. Thích hợp để tạo nội dung liên hệ.

Dropdown menu: trường chọn giá trị được định sẵn từ danh sách đổ xuống.

Checkboxes: trường có kiểu checkbox.

Radio buttons: Cũng là trường đánh dấu nhưng chỉ chọn được một.

Quiz: trường nhập nội dung theo kiểu câu hỏi quiz

CAPTCHA: trường nhập mã captcha, dùng trường này để ngăn chặn spam vào form liên hệ.

File Upload: trường cho phép upload tập tin khi gửi liên hệ qua form.

Submit button: nút gửi dữ liệu form.

Có rất nhiều lựa chọn phải không, nhưng nếu bạn muốn sử dụng các kiểu trường khác thì còn có một số plugin hỗ trợ tạo thêm trường cho contact form 7 mà mình sẽ đề cập ở một số bài khác.

Sau khi chỉnh sửa xong cho field bạn nhìn thấy 2 shortcode của field sinh ra, nhìn bên trái bạn sẽ sử dụng shortcode đó để thêm vào nội dung trường của form. Bạn nên dùng cấu trúc mặc định của field có html dạng:

Chú ý: Copy shortcode đầu tiên. Sử dụng cấu trúc này thì field của bạn sẽ có một cái tiêu đề nằm phía trên và phía dưới là field để nhập. Tuy vậy bạn có thể sử dụng tùy biến HTML tùy ý.

Tiếp đó, bạn cũng cần copy field trong khung màu xanh lá cây bỏ vào khung Message Body của khung mail phía bên dưới. Đây là nội dung email bạn nhận được khi có khách hàng gửi liên hệ, nếu ban không copy vào nội dung khung này thì bạn sẽ không thể thấy nội dung của field đó mà khách hàng nhập.

Chèm form vào Post/Page

Sau khi nhấn Save bạn nhìn thấy một shortcode của form được sinh ra , copy nội dung shortcode này và đặt vào trong post/page nơi bạn muốn form hiển thị .

Copy vào nội dung post/page:

Kết quả nhận được:

Bạn có thể sử dụng form này ở bất kỳ việc gì bạn muốn.

Thêm thuộc tính class và id cho thẻ form

Bạn có thể thêm thuộc tính ‘id’ và ‘class’ cho form bằng cách thêm thuộc tính html_id và html_class vào shortcode [ contact-form-7 ]. Ví dụ:

[ contact-form-7 title="Contact form 1" html_id="contact-form-1234" html_class="form contact-form" ] Thay đổi vị trí hiển thị thông báo Messsages

Thông báo trả về của form Mặc định sau khi nhấn nút submit form, nội dung thông báo trả về của form được hiển thị bên dưới phần nội dung form.

Bạn có thể di chuyển thông báo này ở bất kỳ vị trí nào bằng cách đặt shortcode [ response ] trong form template. Bạn được phép sử dụng nhiều lần ở nhiều vị trí trùng lặp đều hiển thị chung nội dung messages. Ví dụ:

[response] Your Name (required) [ text* your-name ] Subject [ text your-subject ] Your Message [textarea your-message] [response] [submit "Send"]

Thông báo lỗi validation yêu cầu cho trường form (require) Xem hướng dẫn này: Tùy biến thông báo lỗi validation – Contact Form 7

Hướng dẫn Tạo Form Field [ text sanpham id:sanpham class:class1 ]

Trừ thuộc tính số gồm ‘size’ và ‘maxlength’ theo thứ tự này mỗi giá trị thuộc tính ngăn bởi dấu ‘/’, ví dụ:

– Thiết lập giá trị mặc định cho field.

[ text name "gia tri mac dinh" ]

Ví dụ tạo các option cho thẻ select. [ code lang=”plain”] [select YOUR_VALUE id:YOUR_VALUE “1” “2” “3” ] [/code] Sử dụng thuộc tính ID bạn có thể thiết lập giá trị cho field thông qua javascript.

Tạo captcha

Để chèn captcha gồm field và ảnh hiển thị nội dung captcha vào form, bạn nhấn Generate Tag và chọn CAPTCHA tuy nhiên để có thể tạo ảnh captcha bạn phải thêm plugin Really Simple CAPTCHA.

Có 2 shortcode, sinh ra một cái tạo trường input nhập captcha và shortcode thứ 2 hiển thị ảnh chứa nội dung ký tự captcha. Ví dụ:

[captchar captcha-498] [captchac captcha-498]

Chép vào template form cột trái và save lại form. Mở lại trang chứa form kết quả captcha như thế này.

Ngoài các thiết lập chung cho field, còn Có một số thuộc tính cài đặt riêng cho hình captcha như: mầu chữ, mầu nền, kích thước.

Đọc tiếp: Sử lý dữ liệu trong contact form 7

Hướng Dẫn Tạo Form Liên Hệ Với Contact Form 7 Đơn Giản

Với form liên hệ đẹp sẽ giúp website của bạn trở nên chuyên nghiệp hơn với khách hàng, dễ dàng thu hút sự tương tác hơn. Hôm nay mình sẽ hướng dẫn các bạn sử dụng plugin Contact Form 7 để tạo ra những form tuyệt đẹp cực kỳ đơn giản.

Việc đầu tiên chúng ta cần là cài đặt plugin Contact Form 7, (các bạn nào không biết cách cài đặt thì các bạn có thể xem lại bài hướng dẫn cài plugin mình đăng ở đây). Các bạn có thể tìm kiếm plugin ngay tại giao diện tải plugin với từ khóa Contact Form 7 hoặc vào tải trực tiếp tại địa chỉ dưới: https://vi.wordpress.org/plugins/contact-form-7/

Sau khi cài đặt và kích hoạt bên menu sẽ xuất hiện Contact

Biểu mẫu: Nơi thiết kế mẫu gửi form

Thiết lập email: Cấu hình người nhận, người gửi, thư gửi đến email…

Các thông báo cho người dùng biểu mẫu: Nơi cài đặt thông báo khi người dùng gửi mail thành công hoặc thất bại..

Chúng ta tìm hiểu phần đầu tiên là biểu mẫu ( phần quan trọng nhất). Ở phần này chúng ta sẽ có những tag html như sau:

Text: Nhập giá trị là chữ

Email: Nhập giá trị là email

Url: Nhập giá trị là url

Tel: Nhập giá trị định dạng theo số điện thoại

Number: Nhập định dạng là số

Date: Tạo khung chọn ngày tháng hiện hàng

Text area: Tạo lớn nhập nội dung

Dropdown-menu: Tạo menu xổ xuống

Checkboxes: Tạo ra các ô check

Radio buttons: Tạo ra các radio chọn nó tương tự như checkboxes

File: Tạo upload file đính kèm

Submit: Xác nhận gửi thư

ReCAPTCHA: Mã CAPTCHA chống spam ( các bạn xem hướng dẫn tạo ReCAPTCHA cho Contact Form 7)

Ở đây mình chỉ liệt kê những tag html thường dùng, nếu các bạn chưa biết thì về các tag html này thì có thể tham khảo series html căn bản của mình ở những kỳ trước. Mình sẽ tạo demo từ tag html Text, mấy cái còn lại các bạn có thể dựa vào mà làm. Sau khi chọn 1 tag html sẽ xuất hiện bảng sau

Field type: Nếu các bạn bắt buộc người dùng không được bỏ trống giá trị thì hãy check vào ô Required field ( thường áp dụng cho Tên, Số điện thoại, Email). Ở đây mình check luôn

Tên: Tên của tag html ( các bạn phải nhớ tên này vì chúng ta sẽ sử dụng nó ở phần cài đặt tiếp theo, ở đây mình đặt tên là username

Giá Trị Mặc Định: Mình ghi là Hãy nhập họ và tên, ở đây mình sẽ vào ô Use this text as the placeholder of the field để nhắc nhở người dùng biết.

Id attribute: Id của html, ở đây mình nhập là idname

Class attribute: Thuộc tính class của tag html, mình đặt là classname

Xong tất cả rồi các bạn kéo xuống, pluign sẽ tự sản sinh cho chúng ta một đoạn mã: [text* username “Hãy nhập họ và tên”], các bạn nhấn insert Tag để chèn vào sử dụng.

Tương tự như vậy mình sẽ tạo ra thêm 3 tag html nữa là: Email, Số điện thoại và Submit để gửi form.

Chúng ta lưu lại và tiếp tục qua tab cuối là các thông báo cho người dùng biểu mẫu, ở tab này chỉ đơn giản là chứa những đoạn thông báo, các bạn chỉ việc dịch lại hoặc điền theo ý mình thích là được.

Cuồi cùng chúng ta lưu lại thêm 1 lần nữa và copy đoạn shortcode và dán vào bài viết hoặc widgets mà mình muốn xuất hiện. Vậy là bạn đã có được 1 form liên hệ tuyệt đẹp, viết thì có vẻ lâu nhưng làm thì rất nhanh và đơn giản nha. Các bạn có thể xem lại video về contact form 7 mình hướng dẫn để hiểu rõ hơn.

Videos

Những mẫu form liên hệ của contact form 7 tuyệt đẹp

Cách tạo popup cho contact form 7 đơn giản

Sửa lỗi không gửi email được với plugin Easy WP SMTP

Hướng Dẫn Sử Dụng Plugin Form Contact 7 Tạo Form Liên Hệ Trong Quản Trị WordPress

Plugin Contact Form 7 là sự lựa chọn tối ưu để website của bạn trở nên chuyên nghiệp hơn trong mắt khách hàng. Plugin này sẽ giúp bạn tạo nên một form liên hệ tiện lợi và hiệu quả cho trang web WordPress. Để giúp bạn nắm rõ hơn cách sử dụng plugin này, bài viết sau sẽ hướng dẫn tạo form liên hệ trong WordPress với plugin Contact Form 7. Hy vọng những kiến thức sau giúp ích cho bạn!

1. Hướng dẫn cài đặt plugin form contact 7 cho WordPress

Để cài đặt Contact Form 7, bạn tiến hành như cài đặt các plugin thông thường. Đầu tiên, bạn tìm đến mục “Plugin”, chọn “Tạo mới” (Add new) rồi gõ “Contact Form 7” vào ô tìm kiếm. Sau khi tìm được đúng plugin cần dùng, chọn “Cài đặt” (Install) và cuối cùng là “Kích hoạt” (Activate). Sau khi kích hoạt xong, bạn hãy xem cách tạo form liên hệ trong WordPress ở ngay phần tiếp theo của bài viết!

2. Hướng dẫn tạo form liên hệ trong WordPress với plugin Contact Form 7

Bước 1: Sau khi Contact Form 7 đã được kích hoạt, trong thanh menu sẽ hiện ra một mục mới là “Contact”. Bạn kích vào đó và chọn “Add new” để tạo một form mới.

Bước 2: Nhập tiêu đề cho form liên hệ bạn muốn tạo để dễ phân biệt và quản lý. Bên dưới ô tiêu đề là các trường dữ liệu sẵn có cùng những kiểu dữ liệu mà Contact Form 7 hỗ trợ như văn bản ngắn, email, URL, số điện thoại, ngày, văn bản dài, checkbox,… Khi bạn kích vào 1 field mong muốn, bảng giá trị của nó sẽ hiện ra. Bạn có thể nhập thông tin vào đó rồi nhấn “Insert tag” và ở ô bên trái bạn sẽ thấy field vừa nhập được thêm vào.

Bước 3: Chú ý ở ô shortcode được cung cấp bên dưới tiêu đề. Đó là mã mà bạn có thể copy và dán vào nơi mà bạn muốn form đó xuất hiện. Bạn có thể dán nó vào nội dung trang liên hệ trên website và post để thấy thành quả.

Có thể thấy, cách tạo form liên hệ với Plugin Contact Form 7 khá đơn giản phải không nào! Với công cụ này, bạn sẽ được hỗ trợ tạo một form liên hệ tối ưu với những thông tin cần thiết nhất để tăng tương tác giữa khách hàng và doanh nghiệp của bạn.

3. Một số thủ thuật tối ưu hóa form liên hệ với Contact Form 7

Ngoài cách sử dụng Plugin Contact Form 7 , bạn cũng cần biết một số thủ thuật khác để giúp form liên hệ của mình được tối ưu tốt nhất có thể.

Để thêm trang cảm ơn sau khi khách hàng điền và submit form liên hệ trên website của bạn, hãy cài đặt plugin Contact Form 7 – Success Page Redirects và kích hoạt bình thường. Sau đó, vào chỉnh sửa thông tin trong form này tương tự như cách tạo form trong Contact Form 7.

Trong trường hợp email không thể gửi được qua form liên hệ, có thể nhà cung cấp host của bạn đã chặn hàm gửi email. Để không rơi vào tình trạng này, bạn nên tham khảo các host tầm trung và cao cấp của WordPress.

Sau khi khách hàng submit form liên hệ trên website của bạn, form sẽ xuất hiện một dòng chữ phản hồi, chính là thông báo tình trạng form của họ. Để chỉnh sửa các dòng thông báo này, bạn kích sang mục Message (Thông báo đáng chú ý).

Tại đây, bạn sẽ thấy các trường hợp mà khách hàng có thể gặp phải khi điền form liên hệ của bạn như đã gửi thành công, gửi lỗi, điền sai captcha, chưa điền hết các mục,… Bạn có thể sửa phần chữ tiếng Việt thành những câu thông báo bạn mong muốn.

Làm Thế Nào Để Tạo Contact Form 7 WordPress

access_time

Tháng Mười 13, 2023

hourglass_empty

3ít nhất Đọc

Một contact form (biểu mẫu liên hệ) rất có lợi cho trang web của bạn. Contact form 7 giúp giữ kín email để giảm spam và giúp khách truy cập có thể liên hệ trực tiếp với bạn một cách nhanh hơn.

Nếu bạn đã tạo một trang Liên hệ trên website WordPress của bạn thì rất dễ dàng để thêm một contact form vào, cá nhân hóa nó và tiến hành nhận các thông điệp từ khách truy cập.

Các nhanh nhất và dễ dàng nhất để tạo form dạng này là dùng plugins, hiện tại có rất nhiều plugins cho nhu cầu này nhưng chúng tôi sẽ hướng dẫn bạn dùng Contact Form 7

Với hơn 3 triệu lượt cài đặt kích hoat, Contact Form 7 là một trong những plugins tạo contact form phổ biến nhất cho WordPress. Nó có một giao diện trực quan và những thiết lập nhanh chóng giúp bạn tạo ngay được các form mà bạn mong muốn.

Truy cập vào trang quản trị của WordPress

Cách tạo Contact Form 7 trên WordPress Bước 1: Cài đặt Contact Form 7

Bạn gõ ” Contact form 7” và bấm Enter để tìm kiếm. Nhấn Install để cài đặt.

Sau khi cài đặt hoàn tất, bạn hãy chọn Activate để kích hoạt plugins hoạt động trên website.

Sau khi cài đặt và kich hoạt plugins này, một menu Contact mới xuất hiện ở bên trái trong phần quản trị của WordPress.

Thêm phần tiêu đề cho form (ví dụ như: WordPress Contact Form)

Nếu bạn chưa chắc chắn hãy để mặc định để tìm hiểu về ý nghĩa của nó. Bạn có thể dễ dàng quay lại để chỉnh sửa về sau.

Dựa và các labels hay input fields mà bạn chọn, đoạn mã cuối cùng có thể tương tự như sau: Your Name (required) [text* your-name] Your Email (required) [email* your-email] Subject [text your-subject] Your Message [textarea your-message]

[submit “Send”]

Bạn có thể thêm vào các thành phần mà bạn cần bằng cách lựa chọn ở menu

Bước 3: Thiết lập định dạng email

Khi khách truy cập tiến hành gửi thông tin cho bạn thông qua form, bạn sẽ nhận được email chứa tên, địa chỉ liên lạc và thông điệp của họ.

Bạn có thể cài đặt phần email trong tab Email, một vài mail-tags được liệt kê sẽ giúp bạn thiết kế email theo ý muốn.

LƯU Ý: hãy chắc chắn rằng bạn nhập chính xác địa chỉ email của bạn ở filed To để nhận đuược thông điệp của khách truy cập.

Ở tab Messages, bạn có thể tùy chỉnh các thông điệp gửi đập khách truy cập khi họ thực hiện nhấn Submit trên form. Ví dụ: bạn có thể để lại thông điệp cảm ơn khi người dùng gửi thành công thông điệp qua form hoặc một thông điệp khác khi họ gặp lỗi (sai địa chỉ email hoặc không điền đủ các mục bắt buộc)

Khi tất cả đã sẵn sàng, bạn có thể bấm Save ở menu bên phải để lưu lại. Một khi form đã được lưu, bạn sẽ được cung cấp một shortcode như sau:

Để tiến hành đặt form này lên trang của bạn hãy:

Copy lại đoạn shortcode

Bước 6: Kiểm tra lại Form đã tạo

Một điều rất quan trọng sau khi thực hiện tạo contact form 7 là bạn cần kiểm tra lại việc gửi và nhận thông tin. Hãy truy cập trang web của bạn và điền form như là một khách truy cập. Kiểm tra email, nếu nhận được thông tin thì bạn đã thành công.

Bài hướng dẫn giúp bạn dễ dàng thực hiện tạo một form để nhận các thông tin từ khách truy cập thông qua email.

Bạn có thể thoái mái thực hiện việc cá nhân hóa form contact 7 đến khi nào cảm thấy thật hài lòng. Bạn cũng có thể thử dùng thêm plugins để lưu lại các thông điệp khách truy cập gửi vào database phòng khi máy chủ mail gặp sự cố.

Cập nhật thông tin chi tiết về Hướng Dẫn Tạo Form Liên Hệ Trong WordPress Với Contact Form 7 trên website Rafs.edu.vn. Hy vọng nội dung bài viết sẽ đáp ứng được nhu cầu của bạn, chúng tôi sẽ thường xuyên cập nhật mới nội dung để bạn nhận được thông tin nhanh chóng và chính xác nhất. Chúc bạn một ngày tốt lành!