> For the complete documentation index, see [llms.txt](https://docs.balesotomatis.id/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.balesotomatis.id/tools/penjelasan-and-cara-membuat-live-chat-widget.md).

# Penjelasan & Cara Membuat Live Chat Widget

Live Chat (Widget) adalah fitur yang bisa menampilkan Widget berupa layanan Customer Service/Support pada Website kamu.

Ini contoh tampilan Live Chat (Widget) pada Website.

<figure><img src="/files/muJJpFz7WzvmGvGtGuJ3" alt=""><figcaption></figcaption></figure>

Untuk membuatnya sangat mudah, Pertama, silakan buka halaman [**Live Chat Widget**](https://app.balesotomatis.id/live-chat-widget)

<figure><img src="/files/O7e4cw2mDd7ZWU5liqST" alt=""><figcaption></figcaption></figure>

Kemudian klik Tombol **+ New Widget**

<figure><img src="/files/8OSguxmTGYBFuLYycLfD" alt="" width="563"><figcaption></figcaption></figure>

Kemudian anda akan diarahkan ke halaman Widget Editor, seperti berikut ini

<figure><img src="/files/qt2PRC5JrB7mQPJGPJsV" alt=""><figcaption></figcaption></figure>

Pada bagian Widget Style, silakan kamu sesuaikan untuk **Brand Color**, **Widget Position**, **Chat Bubble Text**, dan **Icon** Untuk Widgetnya

<figure><img src="/files/kIJYRiWnjTvOJyBOLs0t" alt=""><figcaption></figcaption></figure>

Kamu juga dapat meng-assign / menugaskan beberapa [**Customer Services**](/tools/penjelasan-and-cara-membuat-customer-services.md) kamu, pada bagian / section **Customer Services**

<figure><img src="/files/2cw95o25ZTu0sxTm6Zme" alt=""><figcaption></figcaption></figure>

Kamu juga dapat mengatur posisinya dengan fitur Sort, caranya, kamu arahkan cursor ke Icon Titik 6, lalu kamu klik dan tahan, nah tinggal kamu susun aja sesuai yang kamu inginkan

<figure><img src="/files/Qm5iHdQpGbWSxEtWkt9r" alt="" width="563"><figcaption></figcaption></figure>

Kemudian, pada bagian / section Widget Settings, silakan kamu atur Domain / Alamat Website yang ingin kamu pasang Live Chat Widget, kamu bisa mengisi dengan format **domainkamu.com** / **\*.domainkamu.com** / **subdomain.domainkamu.com,** untuk format \* (Wildcard) berguna jika kamu ingin memasang Widget ini pada beberapa sub domain yang kamu miliki

<figure><img src="/files/DHtDy1diiVFZPo0vnTvP" alt=""><figcaption></figcaption></figure>

Setelah itu, silakan kamu lengkapi field lainya yaitu **Widget Name**, **Greetings Text**, dan **Pre-filled message**

<figure><img src="/files/AWbLDA8o7PugIbTVi8UC" alt=""><figcaption></figcaption></figure>

Lanjut ke sebelah kanan, ada bagian / section **FB Pixel Settings** dan **GTM Settings**

<figure><img src="/files/GvzqZEB374Nxd9E7J0Qq" alt="" width="563"><figcaption></figcaption></figure>

Pada bagian ini kamu dapat mengatur [**Meta Pixel Event**](/tracking/penjelasan-and-cara-menggunakan-meta-tracking.md) yang ingin kamu trigger ketika Widget Tampil atau kamu juga bisa menyematkan **Google Tag Manager**

Lanjut ke langkah terakhir, pada bagian / section **Other Settings**, kamu dapat atur Visibilitas Widget, apakah ingin tampil / tidak, dan apakah secara default Widget akan terbuka atau tertutup

<figure><img src="/files/tN6521YY8Nf1kY151IsM" alt="" width="563"><figcaption></figcaption></figure>

Kemudian, silakan tekan tombol **Save Changes**, dan silakan tunggu hingga proses simpan selesai