> ## Documentation Index
> Fetch the complete documentation index at: https://docs.thunderphone.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Buat widget web di dasbor

> Siapkan widget klik-untuk-berbicara untuk situs Anda dari halaman Widget Web — tanpa panggilan API.

Halaman **Widget Web** (`/dashboard/web-widgets`) membuat dan mengelola
kunci yang dapat dipublikasikan yang mendukung widget suara ThunderPhone
yang dapat disematkan. Semua yang dilakukan [versi API dari panduan ini](/id/guides/embed-web-widget)
dengan cURL, dilakukan halaman ini dengan formulir — ditambah halaman ini menghasilkan kode
sematan untuk Anda.

## Buat widget

<Steps>
  <Step title="Klik Widget baru dan pilih mode">
    * **Mode agen** — widget selalu menjalankan satu agen yang Anda pilih dari
      dropdown. Penyiapan paling sederhana.
    * **Mode webhook** — pada setiap sesi widget, ThunderPhone memanggil
      URL webhook Anda dan server Anda mengembalikan konfigurasi agen
      untuk pengunjung tersebut (perutean per halaman, pengguna yang sudah masuk, peluncuran bertahap).
      Biarkan URL kosong untuk menggunakan webhook default organisasi Anda;
      saat memasukkan URL baru, Anda juga dapat menjadikannya default organisasi.
  </Step>

  <Step title="Cantumkan domain yang diizinkan">
    Kunci yang dapat dipublikasikan dikunci ke origin: setidaknya satu domain diperlukan,
    dan widget hanya berfungsi pada nama host yang Anda cantumkan. Wildcard
    subdomain seperti `*.example.com` diizinkan (cocok dengan subdomain,
    bukan domain tanpa subdomain); wildcard tanpa domain seperti `*` ditolak.
    `localhost` dan `127.0.0.1` selalu diizinkan, sehingga pengembangan lokal
    berfungsi tanpa perlu mencantumkannya.
  </Step>

  <Step title="Beri nama, aktifkan, lalu buat">
    Toggle **Aktifkan widget** mengontrol apakah kunci menerima
    sesi — Anda dapat membuat widget dalam keadaan nonaktif lalu mengaktifkannya saat peluncuran.
  </Step>
</Steps>

## Ambil kode sematan

Segera setelah pembuatan (atau melalui tombol **Sematkan** di setiap baris), dialog
sematan menghasilkan kode siap tempel dengan kunci yang dapat dipublikasikan Anda sudah
diisi:

* **React** — cuplikan `<ThunderPhoneWidget />` untuk aplikasi bundler.
* **Tag skrip** — pasangan `<script>` CDN + stylesheet untuk situs apa pun.

Dialog juga mempratinjau opsi tampilan dasar — judul, warna
utama, posisi sudut, dan tema terang/gelap — lalu memasukkan pilihan Anda
ke dalam cuplikan. Untuk referensi prop lengkap, hook penataan gaya, dan
opsi headless, lihat [dokumentasi SDK widget](/id/widget/overview).

<Note>
  Kunci yang dapat dipublikasikan (`pk_live_…`) bersifat publik secara desain — aman digunakan dalam
  kode front-end. Salin kapan saja dengan tombol salin pada barisnya.
</Note>

## Kelola widget dari daftar

Setiap baris dapat diedit langsung di tempat:

* **Mode / Agen** — beralih antara mode agen dan webhook, atau ganti
  agen, dengan pemilih inline.
* **Domain** — tambahkan atau hapus domain yang diizinkan sebagai chip.
* **Aktifkan/nonaktifkan** — satu sakelar per widget; widget yang dinonaktifkan berhenti
  menerima sesi seketika.
* **Transfer ke organisasi** — salin atau pindahkan widget ke organisasi lain
  yang Anda ikuti (memindahkan akan menghapusnya dari sini).
* **Hapus** — mencabut kunci yang dapat dipublikasikan; widget berhenti berfungsi
  seketika di semua domain. Tindakan ini tidak dapat dibatalkan.

Sesi widget muncul di [riwayat panggilan](/id/guides/review-calls) dengan
transkrip, rekaman, dan penilaian yang sama seperti panggilan telepon.

## Langkah berikutnya

<CardGroup cols={2}>
  <Card title="Referensi SDK widget" icon="window-maximize" href="/id/widget/overview">
    Detail komponen React, hook headless, dan skrip CDN.
  </Card>

  <Card title="Perutean mode webhook" icon="bolt" href="/id/guides/dynamic-call-config">
    Kembalikan konfigurasi agen per pengunjung dari server Anda.
  </Card>
</CardGroup>