Keyda Widget-API
Für Entwickler oder jeden, der möchte, dass sich der Chat über eine eigene Schaltfläche öffnet.
Installation
<script src="https://keyda.in/business/widget.js"
data-key="kb_live_your_key_here" async></script>The script tag needs only src and data-key. Everything else — colours, position, greeting, language — comes from your dashboard so you never have to redeploy your site to change them.
The widget is drawn in the language set on Install → Language your bot speaks: its button, placeholders and notices, and the direction of the layout (Arabic and Urdu are right-to-left). The strings arrive with the widget's configuration, so there is no second request and nothing to translate on your side.
Modi
Floating (Standard). Ein Launcher-Button in der Ecke, der ein Chat-Fenster öffnet.
Inline. Platzieren Sie einen leeren Container auf der Seite und der Chat füllt diesen stattdessen aus:
<div data-keyda-bot style="height:520px"></div>Der Container benötigt eine Höhe. Im Inline-Modus ist der Chat immer sichtbar, daher gibt es nichts zu öffnen oder zu schließen.
JavaScript API
Verfügbar auf window.KeydaBot sobald das Skript geladen wurde:
| Anruf | Was es tut |
|---|---|
KeydaBot.open() | Öffnet das Chat-Fenster |
KeydaBot.close() | Schließt es |
KeydaBot.toggle() | Öffnet oder schließt |
KeydaBot.expand() | Macht das Panel so hoch wie das Fenster und bis zu 760px breit |
KeydaBot.shrink() | Zurück zur Standardkarte |
KeydaBot.isOpen | true wenn der Chat sichtbar ist |
KeydaBot.isExpanded | true während das Panel erweitert ist |
KeydaBot.clientId | Die Client ID, die diese Seite verwendet |
Beispiel — öffnen Sie den Chat über Ihren eigenen „Chat mit uns“-Button:
<button onclick="KeydaBot.open()">Chat with us</button>window.KeydaBot möglicherweise kurz nach dem Laden der Seite noch nicht. Binden Sie Handler an einen Klick, anstatt sie während des Parsens der Seite aufzurufen.Wie er sich auf Ihrer Seite verhält
- Das Panel öffnet sich über dem Launcher-Button, der an seinem Platz bleibt und zum Schließen-Steuerelement wird. Ein erneutes Tippen darauf, das ✕ im Header oder das Drücken der Escape-Taste schließt den Chat.
- Ein Besucher kann das Panel über den Header erweitern — es vergrößert sich auf die Fensterhöhe und bis zu 760px Breite — und diese Einstellung wird im Browser gespeichert. Auf Smartphones nimmt das Panel bereits den gesamten Bildschirm ein, daher wird das Steuerelement dort nicht angezeigt.
- Your logo size setting changes the logo, not the button: the launcher keeps its size and the logo grows inside it. Button size (Install → Appearance) is what resizes the button itself — small, medium or large — whatever shape it is.
- Four button shapes: a pill with your label, a round bubble, a rounded square, and a chat bubble with a tail. The tail sits on the side facing your page.
- Alles wird innerhalb eines Shadow Roots gerendert, sodass Ihr CSS das Widget nicht beschädigen kann und das CSS des Widgets Ihre Website nicht beeinflusst.
- Das Panel wird erst geladen, wenn ein Besucher es öffnet, damit Ihre Seite nicht verlangsamt wird.
- Die Konversation eines Besuchers bleibt 24 Stunden lang bestehen, falls dieser zurückkehrt, danach beginnt sie von vorn.
- Wenn der Assistent nicht erreichbar ist, zeigt das Widget eine kurze Nachricht an und verursacht niemals einen Fehler auf Ihrer Seite.