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

# Skapa en webbwidget i instrumentpanelen

> Konfigurera en klicka-för-att-ringa-widget för din webbplats från sidan Webbwidgetar – inga API-anrop krävs.

Sidan **Webbwidgetar** (`/dashboard/web-widgets`) skapar och hanterar
de publicerbara nycklar som driver ThunderPhones inbäddningsbara röstwidget.
Allt som [API-versionen av den här guiden](/sv/guides/embed-web-widget)
gör med cURL gör den här sidan med ett formulär — och genererar dessutom
inbäddningskoden åt dig.

## Skapa en widget

<Steps>
  <Step title="Klicka på Ny widget och välj ett läge">
    * **Agentläge** — widgeten kör alltid en röstagent som du väljer i
      rullgardinsmenyn. Den enklaste konfigurationen.
    * **Webhook-läge** — vid varje widgetsesssion anropar ThunderPhone
      din webhook-URL och din server returnerar agentkonfigurationen
      för den besökaren (sidbaserad dirigering, inloggade användare, utrullningar).
      Lämna URL:en tom för att använda organisationens standardwebhook;
      när du anger en ny URL kan du även ange den som organisationsstandard.
  </Step>

  <Step title="Lista tillåtna domäner">
    Publicerbara nycklar är låsta till ursprung: minst en domän krävs,
    och widgeten fungerar bara på de värdnamn du listar. Jokertecken för
    underdomäner som `*.example.com` tillåts (de matchar underdomäner,
    inte den nakna domänen); nakna jokertecken som `*` avvisas.
    `localhost` och `127.0.0.1` är alltid tillåtna, så lokal utveckling
    fungerar utan att du behöver lista dem.
  </Step>

  <Step title="Namnge den, aktivera den, skapa den">
    Växeln **Aktivera widget** styr om nyckeln accepterar
    sessioner — du kan skapa en inaktiverad widget och aktivera den vid lansering.
  </Step>
</Steps>

## Hämta inbäddningskoden

Direkt efter skapandet (eller via knappen **Bädda in** på varje rad) genererar
en inbäddningsdialog färdig kod att klistra in med din publicerbara nyckel
ifylld:

* **React** — ett `<ThunderPhoneWidget />`-utdrag för appar med bundler.
* **Script-tagg** — ett CDN-par med `<script>` + stilmall för alla webbplatser.

Dialogen förhandsvisar även grundläggande utseendealternativ — titel, primär
färg, hörnposition och ljust/mörkt tema — och inkluderar dina val
i utdraget. Information om alla props, stilhooks och det headless-alternativet
finns i [widget-SDK-dokumentationen](/sv/widget/overview).

<Note>
  Publicerbara nycklar (`pk_live_…`) är offentliga avsiktligt — de kan utan risk användas i
  frontendkod. Kopiera en när som helst med kopieringsknappen på dess rad.
</Note>

## Hantera widgetar från listan

Varje rad redigeras på plats:

* **Läge / Agent** — växla mellan agent- och webhook-läge, eller ändra
  röstagenten, med inbäddade väljare.
* **Domäner** — lägg till eller ta bort tillåtna domäner som chips.
* **Aktivera/inaktivera** — en växel per widget; inaktiverade widgetar slutar
  omedelbart att acceptera sessioner.
* **Överför till organisation** — kopiera eller flytta widgeten till en annan organisation
  du tillhör (om du flyttar den tas den bort här).
* **Ta bort** — återkallar den publicerbara nyckeln; widgeten slutar fungera
  omedelbart på alla domäner. Detta kan inte ångras.

Widgetsessioner visas i [samtalshistoriken](/sv/guides/review-calls) med samma
transkription, inspelning och bedömning som telefonsamtal.

## Nästa steg

<CardGroup cols={2}>
  <Card title="Referens för widget-SDK" icon="window-maximize" href="/sv/widget/overview">
    React-komponent, headless-hook och information om CDN-skript.
  </Card>

  <Card title="Dirigering i webhook-läge" icon="bolt" href="/sv/guides/dynamic-call-config">
    Returnera agentkonfiguration per besökare från din server.
  </Card>
</CardGroup>