Як встановити віджет Chatim

Віджет Chatim дозволяє інтегрувати функції живого чату та чат-бота безпосередньо на ваш веб-сайт. Встановлення займає лише один крок: скопіюйте невеликий фрагмент JavaScript і вставте його в HTML вашого сайту. Віджет завантажується асинхронно і не сповільнить ваші сторінки.

Крок 1: Реєстрація та вхід

Перейдіть до Реєстрація та створіть новий обліковий запис, або увійдіть якщо він вже є.
Після входу створіть свій перший проєкт. Після створення проєкту натисніть Встановити в меню навігації, щоб знайти ваш код встановлення.

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

Сторінка встановлення відображає готовий до використання фрагмент коду з попередньо заповненим ID вашого проєкту. Натисніть Копіювати код, щоб скопіювати його в буфер обміну.

Код виглядає так:

<script>
  window.chatim = window.chatim || {};
  window.chatim.cmd = window.chatim.cmd || [];
  window.chatim.settings = { projectId: "YOUR_PROJECT_ID" };
</script>
<script src="https://widget.chatim.app/widget.js" async></script>

Крок 3: Додавання коду на ваш сайт

Додайте цей код на кожну сторінку, де ви хочете бачити віджет чату. Для найкращих результатів розмістіть його безпосередньо перед закриваючим тегом </body>:

  <!-- Your page content -->

  <!-- Chatim Widget -->
  <script>
    window.chatim = window.chatim || {};
    window.chatim.cmd = window.chatim.cmd || [];
    window.chatim.settings = { projectId: "YOUR_PROJECT_ID" };
  </script>
  <script src="https://widget.chatim.app/widget.js" async></script>
</body>
</html>

Як це працює

Перший блок <script> ініціалізує налаштування Chatim з ID вашого проєкту
Другий <script> завантажує віджет асинхронно (не блокуватиме завантаження сторінки)
Після завантаження віджет чату з'являється в кутку вашої сторінки
Відвідувачі можуть натиснути, щоб відкрити віджет і взаємодіяти з вашим чат-ботом

Крок 4: Тестування віджета

Відкрийте ваш сайт у браузері та оновіть сторінку, щоб переконатися, що віджет Chatim з'являється.
Натисніть на нього, щоб відкрити віджет і протестувати функції живого чату та чат-бота.
Перевірте сторінку Відвідувачі у вашій панелі керування - ви повинні бачити свій візит.

Інструкції для конкретних платформ

Конструктори сайтів

WordPress - Додати через редактор теми, плагін або functions.php
Shopify - Додати до файлу theme.liquid вашої теми
WIX - Додати користувацький код через налаштування сайту WIX
Squarespace - Вставити код через налаштування впровадження коду
Webflow - Додати через розділ користувацького коду в налаштуваннях проєкту
Magento - Додати до XML макету вашої теми або налаштувань CMS
Site123 - Додати через налаштування користувацького коду

Менеджери тегів

Google Tag Manager - Створити користувацький HTML тег з кодом віджета
Adobe Launch - Додати як дію користувацького коду в правилі

JavaScript фреймворки

Next.js - Використовувати компонент next/script зі стратегією lazyOnload

Усунення несправностей

Віджет не з'являється

Перевірте розміщення коду - переконайтеся, що він перед </body>, а не всередині <head>
Перевірте ID проєкту - порівняйте його з ID, показаним на вашій сторінці Встановлення
Перевірте консоль браузера - відкрийте DevTools (F12) та шукайте помилки на вкладці Консоль
Вимкніть блокувальники реклами - деякі блокувальники реклами можуть перешкоджати завантаженню віджета
Очистіть кеш - спробуйте примусове оновлення (Ctrl+F5 або Cmd+Shift+R)

З'являються кілька віджетів

Якщо ви бачите дублікати віджетів, код може бути доданий більше одного разу. Перевірте файли теми на дублікати, менеджер тегів на дублікати тегів та налаштування плагінів, які також можуть вставляти віджет.

Потрібна допомога?

Якщо у вас виникли проблеми, зверніться до команди підтримки.

Довідковий центр Chatim