Як підключити віджет на сайт

Віджет ConnectiveOne дозволяє інтегрувати чат-ботів та підключення до операторів безпосередньо на вашому сайті. Ця стаття пояснює, як підключити віджет на ваш сайт.

Передумови

  • Активний бот в ConnectiveOne
  • Доступ до налаштувань бота
  • Можливість редагувати HTML код вашого сайту

Крок 1: Отримання коду вставки

  1. Перейдіть в Налаштування ботів → оберіть потрібного бота
  2. Перейдіть до розділу Widget
  3. Налаштуйте вигляд віджету в конструкторі (якщо потрібно)
  4. Скопіюйте згенерований HTML+JS код

Крок 2: Вставка коду на сайт

Вставте скопійований код на ваш сайт ближче до закриваючого тега </body>.

Важливо: На одній сторінці може бути лише один екземпляр віджету.

Приклад розміщення:

<!DOCTYPE html>
<html>
<head>
  <meta name="viewport" content="width=device-width,initial-scale=1.0">
  <title>Мій сайт</title>
</head>
<body>
  <!-- Ваш контент -->
  
  <!-- Код віджету -->
  <div id="kwizbot_widget"></div>
  <script src="https://engine-instancename.connectiveone.io/kwjs_v2.js"></script>
  <script>
    kw('init', {
      bot_id: 1,
      language_code: "uk"
    });
  </script>
</body>
</html>

Крок 3: Налаштування доменів

Для підключення віджету на сайті необхідно додати ваш домен до списку дозволених.

  1. Перейдіть в Налаштування ботів → оберіть бота → Widget
  2. Знайдіть розділ CORS domains
  3. Додайте ваш домен (вказуйте домени без символу "/" в кінці)

Приклад:

  • Правильно: example.com, www.example.com
  • Неправильно: example.com/, https://example.com

Крок 4: Мобільна версія

Для коректного відображення на мобільних пристроях додайте в тег <head>:

<meta name="viewport" content="width=device-width,initial-scale=1.0">

Перевірка роботи

Після вставки коду:

  1. Оновіть сторінку сайту
  2. Перевірте, чи з'явився віджет (лаунчер або кнопка)
  3. Натисніть на віджет та перевірте, чи відкривається чат
  4. Відправте тестове повідомлення та перевірте, чи отримуєте відповідь

Обмеження

  • На одній сторінці може бути лише один екземпляр віджету
  • Віджет працює тільки через HTTPS (крім localhost)
  • Домени для віджету повинні бути додані в CORS settings
  • Віджет потребує JavaScript для роботи

Пов'язані статті