` to punkt montowania — panel czatu renderuje się wewnątrz niego i wypełnia jego wymiary. Możesz wystylizować ten div w dowolny sposób (nadać mu stałą wysokość, umieścić go w kontenerze flex, w komórce siatki itp.), a panel czatu dostosuje się do niego.
Na stronie potrzebujesz tylko **jednego** znacznika `
```
{% endcode %}
Fragment kodu dla wersji inline zawiera je w `
`, dzięki czemu jedna strona może zawierać kilka czatów kierowanych do różnych miejsc:
{% code overflow="wrap" %}
```html
```
{% endcode %}
W przypadku agenta brzmienie zmienia się na `?agent=AGENT_ID` lub `data-agent="AGENT_ID"`.
Kilka rzeczy, które warto wiedzieć:
- Użyj przycisku kopiowania zamiast wpisywać identyfikator ręcznie. Jeśli identyfikator nie pasuje do żadnej kampanii lub agenta na Twoim koncie, czat nadal będzie działać, ale przełączy się na domyślne reguły routingu.
- Osoba, która jest już w trakcie rozmowy, pozostaje z tym samym rozmówcą, nawet jeśli później trafi na stronę wskazującą gdzie indziej. Zapobiega to zmianie „osobowości” czatu w trakcie trwania rozmowy.
- Miejsce docelowe przypisane do konkretnej strony ma pierwszeństwo przed domyślnymi ustawieniami konta oraz wyzwalaczami słów kluczowych.
### Poinformuj widżet, kim jest odwiedzający (zaawansowane)
Jeśli umieścisz widżet czatu w strefie członkowskiej, portalu klienta lub aplikacji, w której użytkownicy są już zalogowani, Twoja witryna już wie, kim oni są. Możesz przekazać te informacje do widżetu, aby odwiedzający nie musiał podawać danych, które już Ci przekazał, a Twoja sztuczna inteligencja mogła wykorzystać to, co już o nim wiesz.
Dodaj mały blok ustawień **przed** skryptem widżetu:
{% code overflow="wrap" %}
```html
```
{% endcode %}
Twoja strona powinna uzupełnić te wartości po stronie serwera, na podstawie danych aktualnie zalogowanego użytkownika.
Dzieją się dwie rzeczy:
- **Formularz „Zanim zaczniemy...” jest pomijany.** Po podaniu imienia i adresu e-mail odwiedzający przechodzi bezpośrednio do rozmowy, a te dane są zapisywane w jego profilu kontaktu dokładnie tak, jakby sam je wpisał.
- **Wszystko w sekcji `data` jest przekazywane do Twojej sztucznej inteligencji.** Wszystko, co tam umieścisz — plan, numer zamówienia, datę odnowienia, saldo kredytów, liczbę posiadanych licencji — staje się częścią wiedzy AI o tej osobie. Dzięki temu może ona odpowiedzieć na pytanie „kiedy odnawia się mój plan?” bez konieczności wcześniejszego pytania o to, kim jest użytkownik. Użyj nazw pól, które mają dla Ciebie sens; pojawią się one w kontakcie w sekcji Pola niestandardowe. Możesz przesłać do 20 wartości, które są odświeżane przy każdej wiadomości, więc jeśli plan zmieni się w trakcie rozmowy, AI zobaczy nowy.
W przypadku osadzeń typu inline możesz zamiast tego umieścić te same informacje w `
`, co jest przydatne, gdy na jednej stronie znajduje się kilka czatów:
{% code overflow="wrap" %}
```html
```
{% endcode %}
Jeśli Twoja witryna dowiaduje się, kim jest odwiedzający, dopiero po załadowaniu strony — na przykład w aplikacji typu single-page, gdzie logowanie odbywa się bez przeładowania strony — wywołaj to w momencie, gdy będziesz mieć już dane, a widżet sam się zaktualizuje:
{% code overflow="wrap" %}
```html
```
{% endcode %}
Kilka rzeczy, które warto wiedzieć:
- Jeśli dwie różne osoby zalogują się na tym samym komputerze, druga osoba rozpocznie nową rozmowę, zamiast widzieć czat pierwszej. Widżet wykryje zmianę użytkownika i zresetuje się.
- Służy to do zapewnienia kontekstu, a nie do logowania użytkownika. Rozmowy są nadal przechowywane oddzielnie, tak jak zawsze, więc przekazanie `id` nie pozwala nikomu otworzyć czatu innej osoby, a ktoś korzystający z innego urządzenia lub przeglądarki rozpocznie tam nową rozmowę.
- Jest to opcjonalne. Widżet na zwykłej publicznej stronie nie wymaga żadnych z tych działań i zachowuje się dokładnie tak, jak wcześniej.
### Zmiana ustawień widżetu z poziomu własnego kodu (API)
Wszystkie opcje dostępne w panelu **Zarządzaj** widżetem można również zmieniać za pomocą [REST API](../api/reference.md), co jest przydatne, jeśli zarządzasz wieloma stronami internetowymi lub chcesz automatycznie wyłączyć przycisk załącznika dla klienta. Wyślij `PATCH` do `https://api.youraiconnector.com/v1/chat-widget-configs/CONFIG_ID` wraz ze swoim kluczem API oraz polami, które chcesz zmienić — na przykład `{"show_upload_button": false}` ukrywa przycisk załącznika, `{"show_emoji_button": false}` ukrywa wybór emoji, a `{"launcher_icon": "chat-dots"}` zmienia ikonę uruchamiania. `CONFIG_ID` to ten sam identyfikator, co w skrypcie osadzania. Pełna lista akceptowanych pól (nazwa, wiadomość powitalna, kolory, ikona uruchamiania, dozwolone domeny, formularz informacji o odwiedzającym, informacja o prywatności, motyw, styl narożników i czcionki) znajduje się w [Dokumentacji API](../api/reference.md) w sekcji **Widżet czatu**. Strony internetowe uwzględnią zmiany przy następnym załadowaniu.
### Czego się spodziewać po instalacji
Po dodaniu skryptu do swojej witryny, widżet czatu automatycznie utworzy przycisk czatu w rogu strony (domyślnie w prawym dolnym). Widżet pozostaje w stałej pozycji podczas przewijania stron przez użytkowników, dzięki czemu jest zawsze dostępny.
Gdy odwiedzający klikną ten przycisk, rozwinie się on w pełne okno czatu, w którym mogą rozpocząć rozmowę, widząc Twoją wiadomość powitalną. Jeśli opcja zbierania informacji o odwiedzających (Collect visitor info) jest włączona, najpierw pojawi się krótki formularz z prośbą o podanie imienia i adresu e-mail (oraz opcjonalnie numeru telefonu), zanim użytkownik będzie mógł pisać.
Interfejs czatu automatycznie dostosowuje się do różnych rozmiarów ekranu, dzięki czemu działa bezproblemowo zarówno na komputerach stacjonarnych, jak i urządzeniach mobilnych.
### Testowanie wdrożenia
Po dodaniu widżetu do swojej witryny sprawdź, czy działa:
1. Otwórz swoją witrynę w przeglądarce.
2. Kliknij przycisk czatu, aby otworzyć widżet.
3. Wyślij wiadomość testową i potwierdź, że otrzymujesz odpowiedź.
4. Powtórz czynność na innym urządzeniu lub w innej przeglądarce, aby upewnić się, że działa wszędzie.
Jeśli widżet czatu nie pojawia się na Twojej stronie, sprawdź następujące kwestie:
1. Upewnij się, że zastąpiłeś `CONFIG_ID` swoim rzeczywistym identyfikatorem konfiguracji.
2. Upewnij się, że tag skryptu został umieszczony przed tagiem zamykającym `