Keyda Business
ChinaEnglish 登录 免费开始
Keyda Business 文档参考资料

小组件 API

适合开发者,或任何希望通过自己的按钮唤起聊天的人。

安装中

<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.

模式

悬浮(默认)。 角落里的启动按钮,点击可打开聊天面板。

内联模式。在页面上放置一个空容器,聊天窗口将自动填入其中:

<div data-keyda-bot style="height:520px"></div>

容器需要设置高度。在内联模式下,聊天窗口始终可见,因此无需执行打开或关闭操作。

JavaScript API

脚本加载后可在 window.KeydaBot 上使用:

电话功能介绍
KeydaBot.open()打开聊天面板
KeydaBot.close()关闭它
KeydaBot.toggle()打开或关闭
KeydaBot.expand()使面板与窗口同高,最大宽度可达760像素
KeydaBot.shrink()返回标准卡片
KeydaBot.isOpentrue 聊天窗口可见时
KeydaBot.isExpanded面板展开时显示 true
KeydaBot.clientId此页面正在使用的 Client ID

示例 — 通过你自己的“与我们聊天”按钮打开聊天:

<button onclick="KeydaBot.open()">Chat with us</button>
脚本采用异步加载,因此页面加载后的短时间内 window.KeydaBot 可能尚不存在。请将处理程序绑定到点击事件,而不是在页面解析时直接调用。

它在你的页面上的行为表现

  • 面板会打开在启动按钮的上方,启动按钮保持原位并变为关闭控件。再次点击它、点击标头中的 ✕ 或按 Escape 键即可关闭聊天。
  • 访客可以从标题栏展开面板——面板会扩展至窗口高度且宽度最大可达 760px,浏览器会记住此选择。在手机上,面板默认已占满全屏,因此不会显示该控制按钮。
  • 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.
  • 所有内容均渲染在 shadow root 内部,因此您的 CSS 无法破坏小部件,小部件的 CSS 也不会影响您的网站。
  • 面板仅在访客打开时加载,因此不会拖慢您的网页速度。
  • 访客如果再次访问,24 小时内的对话将会延续,之后将开启新对话。
  • 如果无法连接助手,微件会显示一条简短消息,绝不会在你的页面中抛出错误。
Next: App SDKs →