Как добавить чат на сайт и правильно запустить поддержку
Установка кода занимает несколько действий, но хороший запуск начинается раньше: с понятной цели, подготовленных ответов, ответственного и проверки на телефоне.
Проверено по текущим возможностям продукта и тарифным ограничениям.
Главное за минуту
Установка кода занимает несколько действий, но хороший запуск начинается раньше: с понятной цели, подготовленных ответов, ответственного и проверки на телефоне.
- ✓Определите, какие вопросы чат должен закрывать в первую очередь.
- ✓Подготовьте достоверные страницы, правила и ответы для AI и операторов.
- ✓Проверьте положение виджета и сообщения на мобильном экране.
- ✓После установки проведите тест как обычный посетитель.
1. Определите задачу чата
Запишите 5-10 вопросов, из-за которых посетители чаще всего переходят к форме, звонку или мессенджеру. Для магазина это доставка и возврат, для сервиса - цена и запись, для SaaS - тариф и доступ.
Для каждого вопроса укажите источник правильного ответа. Если источник неоднозначен, AI не должен придумывать - диалог лучше передать человеку.
- главная цель
- вопросы для AI
- вопросы только для оператора
2. Подготовьте первый экран
Приветствие должно объяснять пользу. «Поможем выбрать тариф и разобраться с подключением» полезнее общего «Здравствуйте».
Проверьте, не закрывает ли кнопка корзину, меню, оплату или cookie-баннер. На телефоне учтите клавиатуру и нижнюю панель браузера.
- короткий заголовок
- понятное приветствие
- контрастный цвет
- безопасная позиция
3. Установите персональный код
Рабочий код появляется в кабинете после создания и одобрения проекта. Демонстрационный код на публичной странице показывает только формат и не содержит персонального токена.
Обычно скрипт добавляют перед закрывающим тегом body или через менеджер тегов. Используйте его только на разрешенном домене и не публикуйте токен в открытых репозиториях.
- проверить домен
- использовать персональный код
- очистить кеш
4. Проверьте весь путь
Откройте сайт в приватном окне, задайте простой, неоднозначный и позаробочий вопрос. Убедитесь, что история сохраняется, а команда получает уведомление.
Повторите тест на мобильном экране: отправка, ответ AI, передача оператору, закрытие и повторное открытие.
- desktop и mobile
- AI и оператор
- онлайн и офлайн
- ошибка сети и повтор
Проверочный список
- Рабочий домен указан правильно
- Приветствие соответствует цели страницы
- Кнопка не перекрывает важные элементы
- Есть ответы на частые вопросы
- Назначен ответственный за сложные диалоги
- Проверены мобильный и позарабочий сценарии
Вопросы по теме
Можно ли установить чат без разработчика?+
Если есть доступ к шаблону сайта или менеджеру тегов, часто достаточно вставить готовый код.
Когда появится рабочий код?+
После создания аккаунта и проекта. До этого Chtio показывает безопасный демонстрационный пример.
Можно ли изменить внешний вид позже?+
Да. Тексты и сценарии можно менять в проекте. Цвет, положение и другие параметры внешнего вида доступны на Starter и более высоких тарифах.
Посмотрите будущий чат на своем сайте
Введите домен и сохраните черновик. До регистрации показывается стандартный чат Free; адрес и язык перейдут в проект.