Tích hợp form Liên hệ – Ninja Form vào wordpress

Giới thiệu về Ninja Form

Ninja Forms là một trong những contact form plugin miễn phí khá phổ biến. Với Ninja Forms, bạn có thể tạo:

+ Order forms: Bán sản phẩm và cung cấp dịch vụ trực tuyến và được thanh toán trước.
+ Request a Quote forms: Tạo biểu mẫu tùy chỉnh để biết thông tin cần thiết về khách hàng từ đó bạn có thể báo giá cho họ hay ước tính công việc của bạn.
+ Subscription/Opt-in forms: Tìm kiếm thêm người đăng ký nhận thông báo bằng cách tạo opt-in form hay thêm tùy chọn “đăng ký” vào các biểu mẫu khác của bạn.
+ Surveys: dựa vào dữ liệu người dùng để xây dựng chiến lược cho website bằng cách xây dựng các bản khảo sát trên trang web
+ Post submission forms: Cho phép người truy cập thêm bài viết trên blog của họ và chỉnh sửa từ giao diện người dùng trên website của bạn.

Thiết lập SMTP wordpress để wordpress

Để có thể gửi mail việc đầu tiên bạn  cần thiết lập SMTP để gửi mail. Nếu bạn chưa biết thiết lập thì có thể tham khảo thêm bài viết sau:

Thiết lập SMTP của Gmail cho WordPress

Cấu hình SMTP với WordPress

Cài đặt plugin Ninja Form

Bạn có thể tải xuống Ninja Forms trực tiếp từ kho lưu trữ WordPress và tải lên trang web của mình hoặc bạn có thể truy cập Plugins > Add New trong bảng điều khiển WordPress của bạn và sau đó tìm kiếm Ninja Forms ở đó.

Sau khi tìm được kết quả “Ninja Form”, bạn Nhấn Cài đặt → Kích hoạt.

Xây dựng mẫu liên hệ của bạn từ ninja form

– Tại bảng điều khiển WordPress, nhấn chọn Ninja Form → Add New. Tại đây bạn có thể tạo một mẫu liên hệ theo ý thích hoặc sử dụng những mẫu có sẵn. Trong bài này, tôi sẽ sử dụng mẫu “Contact us” để thiết kế.

Sau khi chọn phần Contact Us bạn đợi 1 ít phút để importing mẫu form liên hệ từ ninja form và sẽ chuyển sang giao diện kéo thả để edit

Cấu hình gửi Email

Tại trang chỉnh sửa mẫu liên hệ, nhấn chọn Email & Actions. Tiếp tục nhấn chọn biểu tượng bánh răng của mục Email Confirmation.

Tại đây, bạn sẽ cần chú ý các mục quan trọng sau:

Email nhận tin (1): Nhập địa chỉ email mà bạn muốn nhận thông tin từ người dùng.
Tiêu đề (2): Tiêu đề email gửi về email nhận.
Nội dung Email (3): Trường này sẽ hiển thị những thông tin mà người dùng đã nhập.
Mục Nội dung Email (3) này khá quan trọng, mặc định tại trường Nội dung Email sẽ được thiết lập là {all_fields_table}, biến này sẽ lấy tất cả các thông tin từ các trường tên, email, địa chỉ, nội dung chính… mà người dùng đã nhập và sẽ hiển thị trong email tra về. Ninja Form đã thiết kế đầy đủ các biến để cho bạn có thể tùy chọn lấy hoặc không lấy trường nào, cũng như bố cục trong phần Nội dung.

Tên người gửi: {field:name}
Email người gửi: {field:email}
Nội dung: {field:message}

Để biết đầy đủ các biến được thiết lập trong Ninja Form, hãy xem hướng dẫn chi tiết tại đây

Cài đặt thông báo

Để cài đặt thông báo khi gửi form thành công, nhấn chọn mục biểu tượng bánh răng tại trường Success Message, sửa nội dung theo ý muốn và nhấn chọn Hoàn thành để lưu lại tiến trình.

Sau khi hoàn tất các bước trên, nhấn chọn Nâng cao → Hiển thị thiết lập và điền tên mẫu liên hệ của bạn. Nhấn chọn Hoàn thành để đóng phần chỉnh sửa nâng cao và Xuất bản để lưu lại tất cả thiết lập.

Chèn mẫu liên hệ vào website WordPress

– Sau khi đã hoàn tất bước “Thiết kế và cấu hình gửi mail với Ninja Form”, bạn chỉ cần sao chép đoạn shortcode dưới đây  để gán vào Bài viết hoặc Trang để form liên hệ hiển thị.

– Bạn có thể tham khảo trọn bộ tài liệu hướng dẫn từ nhà cung cấp Ninja Form để có thể tạo mẫu liên hệ ưng ý nhất.

Bạn có thể xem thêm nhiều bài viết khác liên quan mã nguồn wordpresss tại đây 

Bạn có thể xem thông tin và đăng ký hosting wordpress của P.A tại đây