Как установить виджет 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