# Create New Form Builder

Mungkin saat Anda sedang melakukan percakapan dengan pelanggan, Anda perlu mengirimkan form untuk menindaklanjuti permintaan dari pelanggan tersebut. Misalnya, ketika pelanggan menghubungi Agen melalui live chat terkait permintaan registrasi akun, agar dapat menindaklanjuti permintaan pelanggan, Agen perlu mendapatkan data pelanggan dengan mengirimkan form registration.

Sebelum Anda mengirim form registrasi ke pelanggan, Anda perlu membuat form dengan mengklik tombol **'+New Form'** di sudut kanan atas halaman **Form Builder** seperti dibawah ini. 

<figure><img src="/files/wJ5ed1MfBQJcSqjNsYCe" alt=""><figcaption><p>Form Builder </p></figcaption></figure>

Anda akan melihat halaman default untuk membuat form baru.&#x20;

<figure><img src="/files/MjuebrO8sOAAPbXf1ori" alt=""><figcaption><p>Add New Form</p></figcaption></figure>

Di tab **Designer**, Anda dapat melakukan drag and drop objek untuk membuat formulir berdasarkan tab T**ypes** dan tab B**asic**. Misalnya Anda ingin membuat form berupa first name, last name, email dan nomor telepon. Anda dapat menarik type yang sesuai ke bagian designer seperti gambar berikut.&#x20;

<figure><img src="/files/PsmTVtB6qtf4Rb6S9j2V" alt=""><figcaption><p>Designer Tab</p></figcaption></figure>

Jika Anda ingin mengkonfigurasi nama label, validation field atau lainnya, Anda dapat mengklik ikon **'Configuration'** ( ![](/files/MPHhXexKLJcjdz44O9Dj) ) dan akan melihat pop up **Single-Line Text**. Anda dapat mengubah nama label pada bagian label dan jika ingin menyimpan perubahan tersebut, Anda dapat mengklik tombol **'Okay**'.&#x20;

<figure><img src="/files/8yrOzG5RgxIuqnvhq9k8" alt=""><figcaption><p>Pop Up Single-Line Text</p></figcaption></figure>

Anda juga dapat mengkonfigurasi minimal and maximal length, read only field, required field, dll. Pada form dengan mengklik tombol **‘Schema’** (![](/files/-MR4yOmbJ4idGYP3BGjE)).

<figure><img src="/files/SwEUajhXZTf2XDRCDmjq" alt=""><figcaption><p>Config Button</p></figcaption></figure>

Jika objek form sudah ditambahkan, Anda bisa melihat hasil design dari form langsung di tab **View**.

<figure><img src="/files/Aj5vX2Yl5UNFbSEvKY82" alt=""><figcaption><p>View Tab</p></figcaption></figure>

Atau, jika Anda perlu menambahkan atau mengedit schema, opsi atau data di objek yang telah Anda masukkan, Anda dapat mengklik tab **Code**.

<figure><img src="/files/8N0ehtgQBOiVqdjpyTE2" alt=""><figcaption><p>Code Tab</p></figcaption></figure>

Selain itu, di pojok kanan atas, Anda juga dapat menambahkan kode javascript untuk memvalidasi form dengan mengklik tombol **'Code'**.

<figure><img src="/files/1A26fFyGU3g21vooaaUn" alt=""><figcaption><p>Add Javascript Code</p></figcaption></figure>

Jika Anda ingin field di dalam form terisi secara otomatis tanpa perlu mengetik secara manual, Anda dapat menuju ke tab **Autofill Values**. Pada tab ini, Anda dapat menambahkan tagging sebagai penanda form agar sistem dapat mengenali dan mengisi field secara otomatis.&#x20;

<div align="left"><figure><img src="/files/7Ws8ZfvtUqK87kA0aOTa" alt=""><figcaption><p>Add Tagging</p></figcaption></figure></div>

Pada bagian predefined values, Anda dapat mengatur field yang akan terisi secara otomatis dan mengklik tombol '**Add'** untuk menyimpan values tersebut.

<figure><img src="/files/xquzUQsO9kMUEc0G20w0" alt=""><figcaption><p>Add Button</p></figcaption></figure>

Jika values sudah disimpan, Anda bisa melihat hasil field dengan nilai yang sudah ditentukan di tab **preview.**&#x20;

<figure><img src="/files/lS5mURGEDr9MrYISUuXO" alt=""><figcaption><p>Preview Tab</p></figcaption></figure>

Untuk menyimpan form yang sedang dikerjakan, klik tombol **‘save’**. Kemudian akan muncul form metadata, seperti gambar di bawah ini.

<figure><img src="/files/HqzODX9OVha6VWV6F5Zh" alt=""><figcaption><p>Form Metadata</p></figcaption></figure>

**Penjelasan Komponen:**

<table data-header-hidden><thead><tr><th width="326.1666259765625">Nama</th><th>Deskripsi</th></tr></thead><tbody><tr><td><strong>Nama</strong></td><td><strong>Deskripsi</strong></td></tr><tr><td>Title</td><td>Untuk menentukan nama formulir.</td></tr><tr><td>Description</td><td>Untuk memberi pengenalan kepada orang lain tentang formulir Anda atau memberi mereka instruksi khusus, khususnya jika Anda memiliki beberapa formulir dengan judul yang sama. (Optional)</td></tr><tr><td>Type</td><td><p>Pada bagian tipe, terdapat beberapa opsi yang tersedia yaitu : </p><p></p><ul><li><strong>Sales</strong> = form akan muncul di halaman sales seperti deal dan lead. </li><li><strong>Task Management</strong> = form dapat ditambahkan di halaman task. </li><li><strong>Service</strong> = form akan muncul pada halaman customer support. </li></ul></td></tr></tbody></table>

Ketika form metadata telah diisi, klik tombol **‘save’** dan form akan dibuat dan muncul di daftar form builder. Setelah form dibuat, Anda dapat mengedit form, mengkonfigurasi email settings, membagikan form, atau menghapus form.&#x20;


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.3dolphins.ai/5.3.0-id/customer-service/form-management/form-builder/create-new-form-builder.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.