Keyda API widżetu
Dla deweloperów lub każdego, kto chce, aby czat otwierał się po kliknięciu własnego przycisku.
Instalacja
<script src="https://keyda.in/business/widget.js"
data-key="kb_live_your_key_here" async></script>Znacznik skryptu potrzebuje tylko src i data-key. Wszystko inne — kolory, pozycja, powitanie, języki — pochodzi z Twojego panelu, dzięki czemu nigdy nie musisz ponownie wdrażać strony, aby je zmienić.
Tryby
Pływający (domyślnie). Przycisk uruchamiający w rogu, otwierający panel czatu.
Wbudowany. Umieść pusty kontener na stronie, a czat wypełni go zamiast wyświetlać się w dymku:
<div data-keyda-bot style="height:520px"></div>Kontener potrzebuje wysokości. W trybie wbudowanym czat jest stale widoczny, więc nie ma nic do otwierania ani zamykania.
JavaScript API
Dostępne na window.KeydaBot po załadowaniu skryptu:
| Zadzwoń | Co to robi |
|---|---|
KeydaBot.open() | Otwiera panel czatu |
KeydaBot.close() | Zamyka go |
KeydaBot.toggle() | Otwiera lub zamyka |
KeydaBot.expand() | Sprawia, że panel ma wysokość okna i szerokość do 760 px |
KeydaBot.shrink() | Powrót do standardowej karty |
KeydaBot.isOpen | true kiedy czat jest widoczny |
KeydaBot.isExpanded | true, gdy panel jest rozwinięty |
KeydaBot.clientId | Identyfikator klienta (client id) używany przez tę stronę |
Przykład — otwórz czat za pomocą własnego przycisku „Porozmawiaj z nami”:
<button onclick="KeydaBot.open()">Chat with us</button>Skrypt ładuje się asynchronicznie, więc
window.KeydaBot może przez chwilę nie istnieć po załadowaniu strony. Przypisuj obsługę zdarzeń do kliknięcia zamiast wywoływać ją w trakcie parsowania strony.Jak zachowuje się na Twojej stronie
- Panel otwiera się nad przyciskiem uruchamiania, który pozostaje na swoim miejscu i staje się elementem zamykającym. Ponowne dotknięcie, symbol ✕ w nagłówku lub naciśnięcie klawisza Escape zamyka czat.
- Odwiedzający może rozwinąć panel za pomocą nagłówka – rośnie on do wysokości okna i szerokości do 760 px, a ten wybór jest zapamiętywany w przeglądarce. W telefonach panel zajmuje już cały ekran, więc ten element sterujący nie jest tam wyświetlany.
- Ustawienie rozmiaru logo zmienia logo, a nie przycisk: launcher to stała pigułka o szerokości 52 px (58 px dla kształtów okrągłych i kwadratowych), a logo rośnie w jego wnętrzu.
- Wszystko renderuje się wewnątrz shadow root, więc Twoje CSS nie uszkodzi widgetu, a CSS widgetu nie wpłynie na Twoją stronę.
- Panel ładuje się dopiero po otwarciu przez odwiedzającego, więc nie spowalnia strony.
- Rozmowa odwiedzającego trwa przez 24 godziny, jeśli wróci, a potem rozpoczyna się od nowa.
- Jeśli asystent jest niedostępny, widżet wyświetla krótką wiadomość i nigdy nie zgłasza błędu na stronie.