Plugin Contact Form 7 giúp bạn tạo form liên hệ dễ dàng

Tạo form liên hệ thật dễ dàng với Contact form 7 cho WordPress

Trong một website, việc giữ kết nối với khách hàng là việc làm quan trọng và cần thiết, đặc biệt là với các website bán hàng, những hình thức như email, điện thoại, địa chỉ sẽ là bắt buộc, nhưng nếu thiết cả một form liên hệ thì là thiếu sót nghiệm trọng rồi nhé, sau đây Jam xin chia sẻ thông tin và mẹo về làm một form liên hệ đơn giản, nhanh chóng với Contact Form 7 cho WordPress.

Plugin Contact Form 7 giúp bạn tạo form liên hệ dễ dàng
Plugin Contact Form 7 giúp bạn tạo form liên hệ dễ dàng

Thiết lập form liên hệ

Okey giờ chúng ta bắt đầu cài đặt và tạo form liên hệ đầu tiên nhé:

Tạo form liên hệ mới
Tạo form liên hệ mới

Các bạn bấm vào nút thêm tại số 2 trong ảnh, ngôn ngữ tiếng Việt mặc định sẽ được nạp vào trong form, cái này tùy vào ngôn ngữ website của bạn nhé.

Các trường mặc định
Các trường mặc định

Khi bấm vào nút tạo mới, các bạn sẽ có những trường mặc định với ngôn ngữ của trang, các bạn có thể tạo luôn form liên hệ đơn giản này chỉ bằng cách bấm nút “Lưu” là xong, tuy nhiên, các bạn có thể cấu hình thêm với các trường khác cho người dùng nhập vào form và vào email gửi cho khách hàng, cụ thể:

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

Các bạn để ý bên phải form mặc định có nút thêm các trường để bạn lựa chọn:

 

Trường tùy biến của Contact Form 7
Trường tùy biến của Contact Form 7

Có một mã dùng để dán vào bên trái chỗ form hiển thị cho người dùng, còn một ID để thêm vào nội dung email bên dưới để gửi cho người dùng, các bạn có thể thêm rất nhiều trường tại đây.

Và khung bên trái, nơi người dùng sẽ nhìn thấy sẽ thêm đoạn code này:

<p>Thông điệp<br />
    [text text-796]</p>

Thêm form vào Page

Bạn lưu lại những thiết lập bên trên bằng cách bấm vào nút lưu, sau đó bạn sẽ dùng mã shortcode của form này để chèn vào bất kì đâu, tôi lấy ví dụ là Page Contact trong WordPress:

Copy đoạn shortcode mà chúng ta vừa tạo
Copy đoạn shortcode mà chúng ta vừa tạo

Sau đó bạn tạo trang Contact, thả mã này vào nội dung của trang:

Tạo trang contact và thả code này vào
Tạo trang contact và thả code này vào

Sau đó chúng ta có thể truy cập trang này và thưởng thức:

Trang liên hệ
Trang liên hệ

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

TÁC GIẢ:

Tôi là Jam, thâm niên 7 năm thiết kế website và làm SEO. Hãy theo dõi blog của tôi để nhận được nhiều chia sẻ thú vị xung quanh chủ đề công nghệ.

Có 5 bình luận !

  1. Tại sao mình đã làm theo như cách của bạn để tạo form liên hệ rồi nhưng khi mình thử thì mọi thứ đều được chỉ trừ mỗi phần file có vấn đề: mail nhận được chỉ có tên file nhưng không xem được file

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 *