Keyda Business
RussiaEnglish Войти Начать бесплатно
Документация Keyda BusinessСправочник

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

Контейнеру нужна высота. В режиме inline чат всегда виден, поэтому его не нужно открывать или закрывать.

JavaScript API

Доступно на window.KeydaBot после загрузки скрипта:

ПозвонитьЧто он делает
KeydaBot.open()Открыть панель чата
KeydaBot.close()Закрывает его
KeydaBot.toggle()Открыть или закрыть
KeydaBot.expand()Делает панель во всю высоту окна и шириной до 760px
KeydaBot.shrink()Вернуться к стандартной карточке
KeydaBot.isOpentrue когда чат виден
KeydaBot.isExpandedtrue пока панель развернута
KeydaBot.clientIdИдентификатор клиента, который использует эта страница

Пример — откройте чат с помощью вашей собственной кнопки «Напишите нам»:

<button onclick="KeydaBot.open()">Chat with us</button>
Скрипт загружается асинхронно, поэтому window.KeydaBot может быть недоступен сразу после загрузки страницы. Привязывайте обработчики к клику, а не вызывайте их во время парсинга страницы.

Как он ведет себя на вашей странице

  • Панель открывается над кнопкой запуска, которая остается на месте и становится кнопкой закрытия. Повторное нажатие на нее, на ✕ в заголовке или клавишу Escape закрывает чат.
  • Посетитель может развернуть панель из заголовка — она увеличивается до высоты окна и ширины до 760 пикселей — и этот выбор запоминается в браузере. На телефонах панель сразу занимает весь экран, поэтому элемент управления там не отображается.
  • 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 →