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

# Utwórz widżet internetowy w panelu

> Skonfiguruj widżet „kliknij, aby rozmawiać” dla swojej witryny na stronie Widżety internetowe — bez wywołań API.

Strona **Widżety internetowe** (`/dashboard/web-widgets`) tworzy i zarządza
kluczami publicznymi, które obsługują osadzany widżet głosowy ThunderPhone.
Wszystko, co [wersja API tego przewodnika](/pl/guides/embed-web-widget)
robi za pomocą cURL, ta strona robi za pomocą formularza — dodatkowo generuje
dla Ciebie kod do osadzenia.

## Utwórz widżet

<Steps>
  <Step title="Kliknij Nowy widżet i wybierz tryb">
    * **Tryb agenta** — widżet zawsze uruchamia jednego agenta wybranego
      z listy rozwijanej. Najprostsza konfiguracja.
    * **Tryb webhooka** — podczas każdej sesji widżetu ThunderPhone wywołuje
      adres URL Twojego webhooka, a Twój serwer zwraca konfigurację agenta
      dla tego użytkownika (routing zależny od strony, zalogowani użytkownicy, wdrożenia).
      Pozostaw adres URL pusty, aby użyć domyślnego webhooka organizacji;
      po wprowadzeniu nowego adresu URL możesz również ustawić go jako domyślny dla organizacji.
  </Step>

  <Step title="Wymień dozwolone domeny">
    Klucze publiczne są przypisane do originów: wymagana jest co najmniej jedna domena,
    a widżet działa tylko na wymienionych nazwach hostów. Dozwolone są
    symbole wieloznaczne dla subdomen, takie jak `*.example.com` (pasują do subdomen,
    a nie do domeny głównej); ogólne symbole wieloznaczne, takie jak `*`, są odrzucane.
    `localhost` i `127.0.0.1` są zawsze dozwolone, więc lokalne programowanie
    działa bez ich dodawania do listy.
  </Step>

  <Step title="Nadaj nazwę, włącz i utwórz">
    Przełącznik **Włącz widżet** określa, czy klucz akceptuje
    sesje — możesz utworzyć wyłączony widżet i włączyć go przy uruchomieniu.
  </Step>
</Steps>

## Pobierz kod do osadzenia

Bezpośrednio po utworzeniu (lub za pomocą przycisku **Osadź** w każdym wierszu) okno
osadzania generuje gotowy do wklejenia kod z uzupełnionym kluczem publicznym:

* **React** — fragment `<ThunderPhoneWidget />` dla aplikacji używających bundlera.
* **Tag skryptu** — para CDN `<script>` + arkusz stylów dla dowolnej witryny.

Okno wyświetla również podgląd podstawowych opcji wyglądu — tytułu, koloru
podstawowego, położenia w rogu i jasnego/ciemnego motywu — oraz uwzględnia Twoje wybory
we fragmencie kodu. Pełny opis właściwości, punkty rozszerzeń stylizacji oraz
opcję headless znajdziesz w [dokumentacji SDK widżetu](/pl/widget/overview).

<Note>
  Klucze publiczne (`pk_live_…`) są z założenia publiczne — można je bezpiecznie umieszczać
  w kodzie front-endu. W dowolnym momencie skopiuj klucz przyciskiem kopiowania w jego wierszu.
</Note>

## Zarządzaj widżetami z listy

Każdy wiersz można edytować na miejscu:

* **Tryb / Agent** — przełączaj między trybem agenta i webhooka lub zmieniaj
  agenta za pomocą selektorów wbudowanych w wiersz.
* **Domeny** — dodawaj lub usuwaj dozwolone domeny jako etykiety.
* **Włącz/wyłącz** — przełącznik dla każdego widżetu; wyłączone widżety natychmiast
  przestają akceptować sesje.
* **Przenieś do organizacji** — skopiuj lub przenieś widżet do innej organizacji,
  do której należysz (przeniesienie usuwa go tutaj).
* **Usuń** — unieważnia klucz publiczny; widżet natychmiast przestaje działać
  we wszystkich domenach. Tej operacji nie można cofnąć.

Sesje widżetu pojawiają się w [historii połączeń](/pl/guides/review-calls) z takim samym
transkryptem, nagraniem i oceną jak połączenia telefoniczne.

## Dalsze kroki

<CardGroup cols={2}>
  <Card title="Dokumentacja SDK widżetu" icon="window-maximize" href="/pl/widget/overview">
    Szczegóły komponentu React, hooka headless i skryptu CDN.
  </Card>

  <Card title="Routing w trybie webhooka" icon="bolt" href="/pl/guides/dynamic-call-config">
    Zwracaj konfigurację agenta dla każdego użytkownika ze swojego serwera.
  </Card>
</CardGroup>
