> ## 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.

# Maak een webwidget in het dashboard

> Stel vanaf de pagina Webwidgets een klik-om-te-praten-widget voor je site in — geen API-aanroepen vereist.

Met de pagina **Webwidgets** (`/dashboard/web-widgets`) maak en beheer je
de publiceerbare sleutels die de insluitbare spraakwidget van ThunderPhone
mogelijk maken. Alles wat de [API-versie van deze handleiding](/nl/guides/embed-web-widget)
met cURL doet, doe je op deze pagina met een formulier — en bovendien wordt de
insluitcode voor je gegenereerd.

## Een widget maken

<Steps>
  <Step title="Klik op Nieuwe widget en kies een modus">
    * **Agentmodus** — de widget voert altijd één spraakagent uit die je in
      de vervolgkeuzelijst selecteert. De eenvoudigste configuratie.
    * **Webhookmodus** — bij elke widgetsessie roept ThunderPhone
      je webhook-URL aan en retourneert je server de agentconfiguratie
      voor die bezoeker (routering per pagina, ingelogde gebruikers, uitrol).
      Laat de URL leeg om de standaardwebhook van je organisatie te gebruiken;
      wanneer je een nieuwe URL invoert, kun je deze ook instellen als de
      organisatiestandaard.
  </Step>

  <Step title="Vermeld de toegestane domeinen">
    Publiceerbare sleutels zijn vergrendeld op oorsprong: minimaal één domein is vereist,
    en de widget werkt alleen op de hostnamen die je vermeldt. Jokertekens voor subdomeinen
    zoals `*.example.com` zijn toegestaan (ze komen overeen met subdomeinen,
    niet met het hoofddomein); algemene jokertekens zoals `*` worden geweigerd.
    `localhost` en `127.0.0.1` zijn altijd toegestaan, zodat lokale ontwikkeling
    werkt zonder ze te vermelden.
  </Step>

  <Step title="Geef de widget een naam, schakel deze in en maak hem">
    De schakelaar **Widget inschakelen** bepaalt of de sleutel
    sessies accepteert — je kunt een widget uitgeschakeld maken en deze bij de lancering inschakelen.
  </Step>
</Steps>

## De insluitcode ophalen

Direct na het maken (of via de knop **Insluiten** in elke rij) genereert een
insluitdialoog gebruiksklare code met je publiceerbare sleutel al
ingevuld:

* **React** — een `<ThunderPhoneWidget />`-snippet voor apps met een bundler.
* **Script-tag** — een CDN-combinatie van `<script>` en stylesheet voor elke site.

De dialoog toont ook een voorbeeld van basisopties voor de weergave — titel, primaire
kleur, hoekpositie en licht/donker-thema — en verwerkt je keuzes
in de snippet. Zie de [widget SDK-documentatie](/nl/widget/overview) voor de volledige referentie van props,
stylinghooks en de headless-optie.

<Note>
  Publiceerbare sleutels (`pk_live_…`) zijn openbaar van opzet — ze kunnen veilig in
  frontendcode worden gebruikt. Kopieer er op elk moment een met de kopieerknop in de betreffende rij.
</Note>

## Widgets beheren vanuit de lijst

Elke rij kan direct worden bewerkt:

* **Modus / Agent** — wissel tussen agent- en webhookmodus, of wijzig
  de spraakagent, met keuzelijsten in de rij.
* **Domeinen** — voeg toegestane domeinen toe of verwijder ze als chips.
* **Inschakelen/uitschakelen** — een schakelaar per widget; uitgeschakelde widgets
  stoppen onmiddellijk met het accepteren van sessies.
* **Overdragen aan organisatie** — kopieer of verplaats de widget naar een andere organisatie
  waartoe je behoort (verplaatsen verwijdert hem hier).
* **Verwijderen** — trekt de publiceerbare sleutel in; de widget werkt
  onmiddellijk niet meer op alle domeinen. Dit kan niet ongedaan worden gemaakt.

Widgetsessies verschijnen in de [oproepgeschiedenis](/nl/guides/review-calls) met hetzelfde
transcript, dezelfde opname en beoordeling als telefoongesprekken.

## Volgende stappen

<CardGroup cols={2}>
  <Card title="Widget SDK-referentie" icon="window-maximize" href="/nl/widget/overview">
    Details over de React-component, headless-hook en het CDN-script.
  </Card>

  <Card title="Routering in webhookmodus" icon="bolt" href="/nl/guides/dynamic-call-config">
    Retourneer agentconfiguratie per bezoeker vanaf je server.
  </Card>
</CardGroup>