Keyda Widget API
For developers, or anyone who wants the chat to open from their own button.
Installing
<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, languages — comes from your dashboard so you never have to redeploy your site to change them.
Modes
Floating (default). A launcher button in the corner, opening a chat panel.
Inline. Put an empty container on the page and the chat fills it instead:
<div data-keyda-bot style="height:520px"></div>The container needs a height. In inline mode the chat is always visible, so there is nothing to open or close.
JavaScript API
Available on window.KeydaBot once the script has loaded:
| Call | What it does |
|---|---|
KeydaBot.open() | Opens the chat panel |
KeydaBot.close() | Closes it |
KeydaBot.toggle() | Opens or closes |
KeydaBot.expand() | Makes the panel as tall as the window and up to 760px wide |
KeydaBot.shrink() | Back to the standard card |
KeydaBot.isOpen | true when the chat is visible |
KeydaBot.isExpanded | true while the panel is expanded |
KeydaBot.clientId | The client id this page is using |
Example — open the chat from your own "Chat with us" button:
<button onclick="KeydaBot.open()">Chat with us</button>The script loads asynchronously, so
window.KeydaBot may not exist for a moment after page load. Attach handlers to a click rather than calling it as the page parses.How it behaves on your page
- The panel opens above the launcher button, which stays where it is and becomes the close control. Tapping it again, the ✕ in the header, or pressing Escape closes the chat.
- A visitor can expand the panel from the header — it grows to the height of the window and up to 760px wide — and the choice is remembered in their browser. On phones the panel is already the whole screen, so the control is not shown there.
- Your logo size setting changes the logo, not the button: the launcher is a fixed 52px pill (58px for the round and square shapes) and the logo grows inside it.
- Everything renders inside a shadow root, so your CSS cannot break the widget and the widget's CSS cannot touch your site.
- The panel loads only when a visitor opens it, so it does not slow your page down.
- A visitor's conversation continues for 24 hours if they come back, then starts fresh.
- If the assistant cannot be reached, the widget shows a short message and never throws an error into your page.