Create New Form

Trình thiết kế biểu mẫu (Form Designer) của ChatBox AI Muathemewpgiare cho phép bạn tạo các form tùy chỉnh để thu thập thông tin khách hàng, sử dụng trong chatbot, live chat hoặc nhúng vào website. Dưới đây là hướng dẫn từng bước để tạo một biểu mẫu mới.


1. Truy cập Form Designer

Để bắt đầu:

  1. Vào mục Settings (Cài đặt)

  2. Chọn Forms (Biểu mẫu)

  3. Nhấn Add New Form (Tạo Form Mới)

Hệ thống sẽ mở giao diện thiết kế form để bạn cấu hình các thông tin cơ bản.


2. Cài đặt thông tin cơ bản của Form

Khi tạo form mới, bạn cần điền các thông tin quan trọng sau:


Form Name (Tên biểu mẫu)

  • Tên này chỉ hiển thị trong DashboardSettings, không hiển thị với khách hàng.

  • Giúp bạn phân loại nhiều form dễ dàng.


Header Layout (Bố cục tiêu đề)

Bạn có thể chọn một trong các bố cục có tiêu đề, hoặc không dùng tiêu đề tùy nhu cầu thiết kế.


Header (Tiêu đề)

  • Chỉ nhập khi bố cục bạn chọn có phần Header.

  • Nội dung này sẽ hiển thị ở đầu form.


Icon (Biểu tượng)

  • Nếu chọn layout có Icon, bạn có thể:

    • Chọn icon từ thư viện

    • Tải icon tùy chỉnh lên

  • Icon giúp form trông trực quan và thu hút hơn.


Success Content (Nội dung khi gửi thành công)

  • Đây là thông báo sẽ hiển thị khi dữ liệu được gửi đi thành công.

  • Có thể dùng HTML đơn giản để định dạng.


Fail Content (Nội dung khi gửi thất bại)

  • Hiển thị khi quá trình gửi form gặp lỗi.

  • Bạn có thể gợi ý người dùng thử lại hoặc cung cấp phương thức liên hệ khác.


3. Thêm Field (Trường nhập liệu)

Để thêm trường mới vào form:

  1. Nhấn vào biểu tượng menu ba chấm (⋮)

  2. Chọn Add Field

Sau đó cấu hình các thông số:


Field ID

  • ID duy nhất cho mỗi trường

  • Sẽ được dùng trong Chat Flow để truy cập dữ liệu form bằng biến

  • Ví dụ: customer_name, email, phone_number


Required (Bắt buộc)

  • Bật nếu bạn muốn trường này phải được điền mới có thể submit.


Label, Placeholder, Default Value

  • Label: Tên trường hiển thị cho người dùng

  • Placeholder: Gợi ý trong ô nhập

  • Default Value: Giá trị mặc định (nếu cần)


Field Type (Loại trường)

Bạn có thể chọn giữa nhiều loại như:

  • Text

  • Email

  • Number

  • Dropdown

  • Checkbox

  • Radio

  • Textarea

  • Date / Time


Validation Type

Dùng nếu muốn kiểm tra định dạng nhập liệu, ví dụ:

  • Email

  • Số điện thoại

  • Chỉ số

  • Ký tự giới hạn


Include in Report (Bao gồm trong báo cáo)

Nếu bật tùy chọn này:

  • Trường sẽ xuất hiện trong mục Inbox Report

  • Bạn có thể nhập Report Column Label để định nghĩa tên cột trong báo cáo


4. Thêm Button (Nút bấm)

Để thêm nút chức năng vào form:

  1. Nhấn biểu tượng menu ba chấm (⋮)

  2. Chọn Add Button

Sau đó thiết lập:


Button ID

  • Một ID duy nhất cho nút

  • Dùng để phân biệt nếu form có nhiều nút


Button Type

Có 2 loại:

Submit

  • Gửi dữ liệu form

Link

  • Dùng để chuyển hướng người dùng đến URL khác

  • Ví dụ: trang cảm ơn, trang hướng dẫn, website chính,…


Label (Nhãn nút)

Là phần văn bản hiển thị trên nút.
Ví dụ: “Gửi thông tin”, “Tiếp tục”, “Xem chi tiết”.


CSS Class (Lớp CSS tùy chỉnh)

  • Cho phép áp dụng CSS riêng để tùy biến giao diện nút

  • Hữu ích nếu bạn muốn form đồng bộ với style website hoặc thương hiệu của bạn


Kết luận

Với Form Designer trong ChatBox AI Muathemewpgiare, bạn có thể:

  • Tạo form thu thập thông tin chuyên nghiệp

  • Tích hợp vào chatbot, website hoặc live chat

  • Sử dụng dữ liệu form trong Chat Flow

  • Tùy chỉnh từng trường và nút theo nhu cầu

  • Tạo trải nghiệm người dùng logic, đẹp mắt và hiệu quả

Was this article helpful?

← Previous Form Designer
Last updated 4 ngày ago

Danh sách hướng dẫn