Dokumentacja

Widżet JavaScript

Zainstaluj widżet czatu za pomocą pełnego kodu wygenerowanego w zakładce Kanały.

Widżet JavaScript dodaje do strony pływający dymek czatu. Wygenerowany kod zawiera dwa tagi skryptu; skopiuj oba z zakładki Kanały swojego agenta.

Szybka konfiguracja

  1. Otwórz u swojego agenta Kanały → Wtyczka na stronę
  2. Wybierz Widżet czatu i włącz kanał
  3. Skopiuj cały wygenerowany kod wraz z oboma tagami skryptu
  4. Wklej go do swojej strony przed </body>
  5. Zapisz i odśwież swoją stronę

Pierwszy tag przygotowuje kolejkę poleceń Agentkit. Drugi ładuje widżet z identyfikatorem agenta i skonfigurowanym adresem URL skryptu. Zachowaj oba tagi i ich wartości razem.

Konfiguracja widżetu

Pozycja

Domyślnie widżet pojawia się w prawym dolnym rogu. Zmień pozycję w ustawieniach Wygląd.

Kolory

Kolory widżetu dopasowują się do ustawień motywu Twojego agenta. Dostosuj je w zakładce Wygląd.

Urządzenia mobilne

Widżet jest w pełni responsywny i automatycznie działa na urządzeniach mobilnych.

Załączniki plików

Odwiedzający mogą dołączać dokumenty, arkusze kalkulacyjne, obrazy i pliki tekstowe bezpośrednio z widżetu. Załączniki są wykorzystywane wyłącznie jako tymczasowy kontekst rozmowy i nie trafiają do źródeł treningowych agenta.

Obsługiwane formaty to PDF, Word, Excel, HTML, TXT, Markdown, JSON, CSV, PNG, JPG, WEBP i GIF. Odwiedzający mogą dołączyć do 3 plików w jednej wiadomości, przy limicie 10 MB na plik. Pliki PDF są odczytywane do pierwszych 20 stron, aby odpowiedzi pozostawały szybkie i niezawodne.

Atrybuty danych

Widżet wykorzystuje atrybuty danych do konfiguracji:

AtrybutOpisWartość domyślna
data-chatbotWymagany. Identyfikator Twojego agenta (zawarty w kodzie do osadzenia)-

Umiejscowienie

Gdzie dodać kod

Wklej oba wygenerowane tagi skryptu przed </body>:

<!DOCTYPE html>
<html>
<head>
  <!-- Your head content -->
</head>
<body>
  <!-- Your website content -->

  <!-- Paste both script tags from Channels > Website embed here -->
</body>
</html>

Aplikacje jednostronicowe

W przypadku SPA dodaj cały wygenerowany kod do głównego szablonu HTML lub pliku index.

Wiele stron

Dodaj ten sam wygenerowany kod na każdej stronie, na której ma się pojawiać widżet, albo umieść go we wspólnym szablonie układu.

Testowanie instalacji

Po dodaniu kodu:

  1. Otwórz swoją stronę w przeglądarce
  2. Sprawdź, czy widoczny jest dymek czatu (domyślnie w prawym dolnym rogu)
  3. Kliknij, aby otworzyć czat
  4. Wyślij testową wiadomość
  5. Sprawdź, czy odpowiedź jest poprawna

Rozwiązywanie problemów

Widżet się nie pojawia:

  • Sprawdź w wyrenderowanym kodzie strony, czy oba wygenerowane tagi skryptu są przed </body>
  • Zweryfikuj, czy identyfikator agenta jest poprawny
  • Wyczyść pamięć podręczną przeglądarki
  • Sprawdź konsolę przeglądarki pod kątem błędów

Nieprawidłowa pozycja:

  • Sprawdź ustawienia Wygląd
  • Poszukaj konfliktów CSS

Brak odpowiedzi:

  • Upewnij się, że istnieje treść treningowa
  • Sprawdź limit wiadomości w swoim planie
  • Przetestuj najpierw w Playground

Dozwolone domeny

Jeśli skonfigurowano dozwolone domeny:

  • Widżet ładuje się tylko na zatwierdzonych domenach
  • Na pozostałych witrynach widżet się nie pojawia (bez wyświetlania błędu)

Skonfiguruj domeny →

Wydajność

Widżet jest zoptymalizowany pod kątem minimalnego wpływu na wydajność:

  • Ładuje się asynchronicznie (atrybut async)
  • Niewielki rozmiar pakietu JS
  • Nie blokuje renderowania
  • Interfejs czatu ładuje się leniwie (lazy loading)

Konflikty stylów

Widżet korzysta z izolowanych stylów i nie powinien powodować konfliktów z Twoją witryną. Jeśli zauważysz problemy:

  1. Sprawdź globalne selektory CSS
  2. Poszukaj reguł z !important
  3. Jeśli problem się utrzymuje, skontaktuj się z pomocą techniczną

Usuwanie widżetu

Aby go usunąć:

  1. Usuń oba wygenerowane tagi skryptu z kodu HTML
  2. Wyczyść pamięć podręczną
  3. Widżet zniknie natychmiast

Kolejne kroki