# WebChat Customization

Fitur ini memungkinkan Anda mengatur tampilan WebChat sesuai dengan kenyamanan Anda saat digunakan. Tampilan WebChat dapat di atur mulai dari tampilan percakapan, jenis font, jenis icon, serta posisi icon.

***

## **Pengaturan Tema**

Dalam pengaturan ini Anda dapat memilih tema warna yang telah tersediakan untuk menyesuaikan dengan brading bisnis Anda. Tema yang dipilih nantinya akan ditampilkan pada preview WebChat agar Anda bisa lebih mudah dalam memilah-milah tema yang cocok.&#x20;

<figure><img src="/files/cyRVHgAy961lUCQFd7JX" alt=""><figcaption><p><em><strong>Tampilan pengaturan tema webchat</strong></em></p></figcaption></figure>

***

## **Pengaturan Icon**

Dalam pengaturan ini Anda dapat mengubah icon WebChat dengan pilihan icon lainnya yang telah disediakan. Jika Anda ingin menggunakan icon lainnya, cukup upload gambar icon yang diinginkan dan icon tersebut akan menjadi icon webchat.

<figure><img src="/files/mQUVJIVTrcO2xNhxRZDh" alt=""><figcaption><p><em><strong>Tampilan pengaturan icon webchat</strong></em></p></figcaption></figure>

***

## **Pengaturan Font**

Dalam pengaturan ini Anda dapat memilih font untuk WebChat yang akan digunakan, sehingga Anda lebih leluasa dalam menyesuaikan tampilan dengan branding bisnis yang dijalankan.

<figure><img src="/files/t2fcEnPeG42an30mW5mb" alt=""><figcaption><p><em><strong>Tampilan pengaturan font webchat</strong></em></p></figcaption></figure>

***

## **Pengaturan Posisi Icon WebChat**

Dalam pengaturan ini Anda dapat menentukan menentukan posisi WebChat yang diinginkan, sehingga pengguna dapat menyesuaikan dengan website yang ditambahkannya.

<figure><img src="/files/TXzgFIWzQmBJq0bhbMbq" alt=""><figcaption><p><em><strong>Tampilan pengaturan posisi icon webchat</strong></em> </p></figcaption></figure>

***

## **Pengaturan Custom Form Pre Chat**

Dalam pengaturan ini Anda dapat mengatur form pre-chat sesuai kebutuhan Anda. Kolom email dan nomor telepon dapat diaktifkan maupun dinonaktifkan. Pesan bantuan dalam input form tersebut juga dapat Anda sesuaikan. Selain itu, Anda juga dapat mengatur urutan input pada form tersebut.

<figure><img src="/files/l0vILSEwRQE2uyzQ2ijk" alt=""><figcaption><p><em><strong>Tampilan pengaturan custom form pre-chat</strong></em></p></figcaption></figure>

***

## **Tema Dark Mode**

Agar lebih nyaman di mata pengguna, socialchat menyediakan opsi tampilan webchat dalam tema gelap. Masing-masing tema yang disediakan sudah didukung untuk tema gelap, sehingga Anda tidak perlu mengkhawatirkan tampilan webchat dalam tema gelap.

Tampilan WebChat kini lebih intuitif dan reponsif, memudahkan komunikasi dengan pelanggan. Dengan desain modern dan fitur lengkap, WebChat membantu Anda mengelola percakapan dengan lebih mudah dan efisien.

***

## **Preview**

**Tampilan WebChat yang sudah diatur tema, icon, font, dan posisinya** kini terlihat lebih menarik, profesional, serta memberikan pengalaman chat  yang lebih nyaman bagi pelanggan.

<figure><img src="/files/JytCxkdN5zImnXTbJOPL" alt=""><figcaption><p><em><strong>Tampilan webchat custom Socialchat</strong></em></p></figcaption></figure>

<figure><img src="/files/A8ZkMqJefKMEBdHc1WKc" alt=""><figcaption><p><em><strong>Tampilan webchat custom Socialchat</strong></em></p></figcaption></figure>


---

# 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://pt-booster-teknologi-indonesias.gitbook.io/docs.socialchat.id/pengaturan-admin/webchat-customization.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.
