Contact Form 7 là một trong những công cụ cho phép người dùng tạo form liên hệ trên website phổ biến nhất và lâu đời nhất cho mã nguồn WordPress. Tuy nhiên, nhiều người vẫn đang gặp khó khăn trong việc sử dụng Contact form 7. Sau đây Hitiem sẽ hướng dẫn các bạn tạo form liên hệ bằng CF7 cho mã nguồn wordpress.

Bước 1: Khi cài đặt wordpress thì các bạn đã cài dặt sẵn plugin contact form 7 sẵn nên là giờ chỉ cần vào active nó lên thôi, còn nếu bạn nào bỏ qua bước cài đặt thì vào cài lại plugin đó.

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

Bước 2: các bạn vào bảng điều khiển chọn mục Contact -> add new -> sau đó đặt tên cho form -> di chuyển qua tab form để mình co thể thiết lập thành phần cho form.

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

Bước 3: ở phần này là nơi các bạn sẽ thiết lập thành phần tạo form liện hệ của bạn.

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

Nội dung màu xanh bên trên là plugin cung cấp sẵn cho cá bạn, các bạn có thể thay đổi tùy sở thích thiết kế.

Còn phần mình đánh dấu màu cam chính là các input, cá bạn chỉ cần chọn và thiết lập cho nó thôi

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

Ở đây mình xóa hết cái có sẵn và để vào đây 1 input mail ở thanh bên trên

Sau khi chọn nó sẽ hiện lên 1 bảng cho các bạn tùy chỉnh class id cũng như là placeholder

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

Ở đây mình đã thêm vào 1 số trường input khác nữa.

Bước 4: ở bước này các bạn vào phần edit builder của trang chủ hay tạo 1 UX block khác tạo form liên hệ này cũng được. Ở đây mình chọn đặt thẳng ở trang chủ cho nhanh.

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

Vào đây các bạn select cái form đã tạo ra là sẽ được như hình.

Lưu ý các bạn cũng có thể chia cột cho form bằng mã html sử dụng các class như container, row, col,… để tùy biến form liên hệ của bạn. Vậy alf mình đã hướng dẫn các bạn cách tạo form liên hệ cơ bản nhất. Chúc các bạn thành công !!!

Ở bài viết sau mình sẽ hướng dẫn các bạn cấu hình mail bằng WP Mail SMTP

Nếu có bất kì thắc mắc nào, vui lòng liên hệ HiTime Chuyên Thiết Kế và Quản lý Website hoặc HiTime Website Design.

Tham khảo thêm:
10 Cách đặt tên thương hiệu cho Startup khởi nghiệp
3 Gợi ý đặt tên thương hiệu theo phong thủy

Trả lời

Email của bạn sẽ không được hiển thị công khai. Các trường bắt buộc được đánh dấu *