> For the complete documentation index, see [llms.txt](https://tailieu.smax.ai/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://tailieu.smax.ai/extend-modules/form-builder/cau-hinh-phan-tu.md).

# Cấu hình phần tử

## Content

Content sử dụng để thêm 1 đoạn mô tả vào trong form

{% hint style="info" %}
Chiều cao của phần tử trong form: Tất cả phần tử trong form sẽ có 1 cài đặt Chiều cao, đây là độ rộng của phần tử trong form. Form sẽ chia ra làm 12 khoảng bằng nhau:

* col-12: Phần tử chiếm độ rộng bằng 12 khoảng
* col-11: Phần tử chiếm độ rộng bằng 11 khoảng
* col-10: Phần tử chiếm độ rộng bằng 10 khoảng

Tương tự với từ col-9 tới col-1
{% endhint %}

<figure><img src="https://1875681896-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fsr3EiPwgSuzEXI3u1tC1%2Fuploads%2FCbcdiFoqzz3V4TLpJulZ%2Fimage%20(1).png?alt=media&amp;token=6b9ff058-a3d5-4919-ae5b-278c23fdd32f" alt=""><figcaption></figcaption></figure>

## Input

Input dùng để thêm 1 trường câu hỏi cho khách hàng nhập câu trả lời ngắn và lưu lại câu trả lời vào 1 thuộc tính trên chatbot

<figure><img src="https://1875681896-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fsr3EiPwgSuzEXI3u1tC1%2Fuploads%2FgOt8qtHR8QeiQYZlCZo7%2Fimage%20(1).png?alt=media&amp;token=cb0d21e9-32b1-4d1b-aa06-481419f4586c" alt=""><figcaption></figcaption></figure>

**Tiêu đề:** Nội dung của câu hỏi

<figure><img src="https://1875681896-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fsr3EiPwgSuzEXI3u1tC1%2Fuploads%2FbYfokPQ5i2t9yPXkk7Ax%2Fimage%20(1).png?alt=media&amp;token=b38eaa23-bce5-42e1-ad67-c8c9db9d4fa2" alt=""><figcaption></figcaption></figure>

**Thuộc tính:** Thuộc tính trên chatbot sẽ lưu lại câu trả lơi của khách hàng

<figure><img src="https://1875681896-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fsr3EiPwgSuzEXI3u1tC1%2Fuploads%2FCTZ0pwHh7ZgHUE3k3RW7%2Fimage%20(1).png?alt=media&amp;token=8c4c49fd-9656-4ce2-a363-8593b1a290e6" alt=""><figcaption></figcaption></figure>

**Giá trị mặc định:** Nếu khách hàng không nhập gì vào trường input, hệ thống sẽ tự ghi nhận giá trị mặc định này là câu trả lời của khách hàng

<figure><img src="https://1875681896-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fsr3EiPwgSuzEXI3u1tC1%2Fuploads%2F0T7eiujQEW2FkVpt2OPt%2Fimage%20(1).png?alt=media&amp;token=9dd014f2-8ab9-49eb-8c2e-df4554a4b814" alt=""><figcaption></figcaption></figure>

**Placeholder:** Gợi ý để khách hàng trả lời input, khi khách hàng nhập dữ liệu vào placeholder sẽ bị ẩn đi

{% hint style="danger" %}
Không thể sử dụng placeholder và giá trị mặc định cùng 1 lúc
{% endhint %}

<figure><img src="https://1875681896-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fsr3EiPwgSuzEXI3u1tC1%2Fuploads%2FwFyZN8uHTGQ6kEnqeU3t%2Fimage%20(1).png?alt=media&amp;token=633a42ef-5a28-4868-a6e3-9ec26b2476aa" alt=""><figcaption></figcaption></figure>

**Kiểu dữ liệu:** Tùy chọn kiểu câu trả lời mà khách hàng cần nhập, ví dụ bạn muốn khách hàng trả lời họ tên thì chọn Text, số điện thoại thì chọn Number, Email thì chọn Email,...

<figure><img src="https://1875681896-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fsr3EiPwgSuzEXI3u1tC1%2Fuploads%2FJdjL7HzYr7fd7B4CiyJX%2Fimage%20(1).png?alt=media&amp;token=c0bcc70e-d91c-451e-8366-8d404fdc3548" alt=""><figcaption></figcaption></figure>

**Bắt buộc:** Cho phép khách hàng bỏ qua không cần trả lời hay bắt buộc phải trả lời

<figure><img src="https://1875681896-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fsr3EiPwgSuzEXI3u1tC1%2Fuploads%2FcANDFopKDDZpl2jXiC8S%2Fimage%20(1).png?alt=media&amp;token=9bc19614-2e73-4c99-a6bc-a8b0eefacdee" alt=""><figcaption></figcaption></figure>

## Text Area

Tương tự như Input, nhưng Text Area có khung nhập dữ liệu rộng hơn, cho phép khách hàng nhập một đoạn văn bản dài hơn vào form

{% hint style="info" %}
Nếu bạn muốn khách hàng trả lời những câu hỏi ngắn gọn như họ tên, số điện thoại, email,... thì nên dùng Input

Nếu bạn muốn khách hàng trả lời những câu dài hơn như mô tả bản thân, giới thiệu,... thì nên dùng Text Area
{% endhint %}

<figure><img src="https://1875681896-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fsr3EiPwgSuzEXI3u1tC1%2Fuploads%2F8F7CE9AfxcsXDMMnulB9%2Fimage%20(1).png?alt=media&amp;token=c7a235c1-d15b-40c8-91b5-149a7b0d811e" alt=""><figcaption></figcaption></figure>

## Select

Select dùng để cho khách hàng lựa chọn các tùy chọn từ menu dạng thả (dropdown list)

Để thêm tùy chọn mới, bạn cần nhập nội dung vào ô tùy chọn, sau đó gõ Enter để lưu lại

<figure><img src="https://1875681896-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fsr3EiPwgSuzEXI3u1tC1%2Fuploads%2F58ntkWw53d2QPDqeR3Kd%2Fimage%20(1).png?alt=media&amp;token=31db53e2-8d8f-4100-9fe2-0cfc4ff8d806" alt=""><figcaption></figcaption></figure>

## Checkbox

Checkbox được sử dụng để làm dạng câu hỏi có nhiều lựa chọn

<figure><img src="https://1875681896-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fsr3EiPwgSuzEXI3u1tC1%2Fuploads%2FqsHmKbnu8MN4aSXYHn98%2Fimage%20(2).png?alt=media&amp;token=1591faf6-1c97-4daa-b0e4-144f82f60f09" alt=""><figcaption></figcaption></figure>

Bạn có thể sử dụng Content kết hợp với nhiều Checkbox để làm dạng câu hỏi nhiều lựa chọn như ảnh phía dưới

<figure><img src="https://1875681896-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fsr3EiPwgSuzEXI3u1tC1%2Fuploads%2FB5CwhZfWIWLsZQ2J4uR9%2Fimage%20(1).png?alt=media&amp;token=15f28e03-e44c-4a5c-9c86-3a1d380650dd" alt=""><figcaption></figcaption></figure>

## Slide show

Slide show dùng để hiển thị 1 danh sách các slide ảnh trượt ngang trên form

<figure><img src="https://1875681896-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fsr3EiPwgSuzEXI3u1tC1%2Fuploads%2FbLDxzGYjEUxgF8LtBM82%2Fimage%20(1).png?alt=media&amp;token=77fa722e-62ee-42ab-a705-a2bfed502e66" alt=""><figcaption></figcaption></figure>

## Upload

Upload cho phép khách hàng tải lên 1 tệp tin hoặc 1 hình ảnh

<figure><img src="https://1875681896-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fsr3EiPwgSuzEXI3u1tC1%2Fuploads%2Fh79dgrXzG7sPszrPgIIs%2Fimage%20(1).png?alt=media&amp;token=67228bb1-567c-45b1-93ea-a6e562b5dbbf" alt=""><figcaption></figcaption></figure>

## Radio

Radio dùng để tạo ra câu hỏi chỉ cho phép khách hàng lựa chọn 1 câu trả lời trong danh sách các đáp án, bạn có thể sử dụng kết hợp với Content để tạo ra câu hỏi

<figure><img src="https://1875681896-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fsr3EiPwgSuzEXI3u1tC1%2Fuploads%2F2MKWL1uvrHPK2wc3Smjx%2Fimage%20(1).png?alt=media&amp;token=fa01e6df-1756-463a-b52e-13a49ba4cb80" alt=""><figcaption></figcaption></figure>

## &#x20;Date

Date dùng để khách hàng nhập ngày tháng năm, ví dụ ngày tháng năm sinh, ngày đặt bàn,...

<figure><img src="https://1875681896-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fsr3EiPwgSuzEXI3u1tC1%2Fuploads%2FmQNg2fGrKhH8Km8iD7cM%2Fimage%20(2).png?alt=media&amp;token=86beadc1-7f42-42a0-8aba-e86ec24284e7" alt=""><figcaption></figcaption></figure>

## Time

Time dùng để cho khách hàng nhập thời gian, ví dụ thời gian đặt bàn, thời gian hẹn lịch,...

<figure><img src="https://1875681896-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fsr3EiPwgSuzEXI3u1tC1%2Fuploads%2FQmczKCSapw8DiSB1mqn9%2Fimage%20(1).png?alt=media&amp;token=2a86d9b4-195a-4820-ac0b-9fc03887008b" alt=""><figcaption></figcaption></figure>

## Location

Location dùng để cho khách hàng lựa chọn địa chỉ (chỉ hỗ trợ tại Việt Nam)

<figure><img src="https://1875681896-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fsr3EiPwgSuzEXI3u1tC1%2Fuploads%2F3vV4OaEi8Qq6mrc25i7T%2Fimage%20(1).png?alt=media&amp;token=9a8a97ff-6675-473f-83d7-46ed049195a1" alt=""><figcaption></figcaption></figure>

## Button submit

Button submit dùng để tạo nút điền lại hoặc xác nhận khi khách hàng hoàn tất điền thông tin vào form

<figure><img src="https://1875681896-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fsr3EiPwgSuzEXI3u1tC1%2Fuploads%2FOMfeYB7VcfMJaXd3yAda%2Fimage%20(1).png?alt=media&amp;token=0b3694dd-257e-495c-8afa-1c582c80a6e1" alt=""><figcaption></figcaption></figure>