Коротко: чтобы поставить ИИ-ассистента на сайт Tilda, скопируйте строку кода из кабинета Kryps, откройте в Tilda "Настройки сайта", раздел "Ещё", и вставьте код в поле "HTML-код для вставки внутрь BODY". Опубликуйте все страницы заново. Чат появится в правом нижнем углу на каждой странице, а заявки с контактом сразу уйдут в вашу CRM.
Почему на Tilda чат нужен чаще, чем кажется
Tilda выбирают, когда сайт нужен быстро: лендинг под рекламу, сайт услуги, страница акции. Такие сайты почти всегда живут на платном трафике из Яндекс Директа или VK Рекламы. Посетитель приходит с конкретным вопросом, листает пару экранов и решает, писать или уйти. Форма "Оставьте заявку" в конце страницы на этот вопрос не отвечает. Человек хочет узнать цену своего варианта, сроки или есть ли свободное время на этой неделе, а не ждать звонка.
ИИ-ассистент закрывает этот разрыв. Он отвечает своими словами по информации с вашего сайта, уточняет задачу и предлагает оставить телефон, когда клиент уже готов. Поскольку Kryps видит, какой блок страницы читает посетитель, вопрос он задаёт по теме: на блоке с ценами предлагает посчитать стоимость, на блоке с отзывами снимает сомнения.
Что понадобится до установки
Подготовка занимает пару минут:
- аккаунт в Kryps (7 дней бесплатно, карта не нужна);
- доступ к проекту в Tilda с правами на редактирование настроек сайта;
- адрес сайта, чтобы ассистент прочитал его и собрал базу знаний.
Свой HTML-код в Tilda можно вставлять на платных тарифах. Если проект на бесплатном плане, сначала проверьте условия в справке Tilda.
Шаг 1. Создайте ассистента и дайте ему прочитать сайт
В кабинете Kryps откройте раздел "Мой виджет" и создайте виджет. Укажите адрес сайта на Tilda. Ассистент прочитает главную и до 40 страниц: цены, услуги, условия, вопросы и ответы, контакты. Через несколько минут в разделе "Обучение и продажи" появится база знаний, разложенная по разделам.
Проверьте, всё ли нашлось. Tilda часто собирает страницу из блоков-картинок с текстом поверх, и часть информации может быть только на изображении. Если раздел "Цены" или "Как проходит работа" пустой, впишите туда несколько строк своими словами или загрузите прайс в разделе "База знаний". Ассистент опирается только на то, что есть в базе, и не выдумывает цены.
Шаг 2. Скопируйте код виджета
В разделе "Мой виджет" есть одна строка кода вида:
`<script src="https://api.kryps.ru/embed.js" data-widget-id="..." async></script>`
Скопируйте её целиком. Атрибут async означает, что скрипт грузится параллельно со страницей и не тормозит её отрисовку.
Шаг 3. Вставьте код в настройки сайта Tilda
- Откройте проект в Tilda и нажмите "Настройки сайта".
- Перейдите в раздел "Ещё".
- Найдите поле "HTML-код для вставки внутрь BODY" и нажмите "Редактировать код".
- Вставьте строку из кабинета Kryps и сохраните.
- Вернитесь к списку страниц и нажмите "Опубликовать все страницы".
Последний шаг важен. Tilda добавляет общий код только при публикации, поэтому без повторной публикации старые страницы останутся без чата.
Если поле в настройках недоступно
Добавьте на страницу блок T123 из раздела "Другое", он называется "HTML-код". Вставьте в него ту же строку и опубликуйте страницу. Этот способ работает постранично: если страниц несколько, блок нужен на каждой, где должен быть чат. Удобный приём: сделайте блок частью подвала и используйте подвал как общий для всех страниц.
Шаг 4. Проверьте, что чат работает
Откройте опубликованный сайт в обычном окне браузера, не в редакторе. В правом нижнем углу появится кнопка чата. Нажмите её: под приветствием будут кнопки с частыми запросами, их ИИ составляет по вашему сайту, а поправить можно в кабинете на вкладке "Модель и кнопки".
Напишите вопрос как клиент. Например: "Сколько стоит под ключ для квартиры 50 метров?". Ассистент должен ответить по вашим ценам и предложить следующий шаг. Если ответ неточный, поправьте раздел базы знаний и спросите снова. Вкладка "Проверить диалог" в кабинете позволяет тренировать ассистента, не трогая сайт и не тратя лимит диалогов.
Как ассистент понимает блоки на Tilda
Kryps определяет блок, который сейчас на экране, по заголовку секции. На Tilda заголовки часто сделаны отдельными блоками или текстом на картинке, поэтому подписи блоков могут быть неточными. Это легко исправить: в настройках нужного блока Tilda откройте поле для атрибутов или добавьте в блок T123 разметку с атрибутом `data-krips-block="Цены"`. Тогда ассистент будет точно знать, что человек сейчас читает раздел с ценами, и через 15 секунд на нём предложит помощь именно по ценам.
Цели в Яндекс Метрике и Google Analytics
Виджет сам отправляет события в счётчики, которые уже стоят на сайте:
- krips_open, когда посетитель открыл чат;
- krips_dialog, когда он написал первое сообщение;
- krips_quick_action, когда нажал кнопку под приветствием;
- krips_lead, когда оставил телефон или почту.
В Метрике создайте цели типа "JavaScript-событие" с этими идентификаторами. В Google Analytics 4 события появятся сами, их достаточно отметить как ключевые. Если у вас подключён Google Tag Manager, события также попадают в dataLayer. В кабинете Kryps укажите номер счётчика Метрики, тогда в заявку попадёт ClientID посетителя и продажи из CRM можно будет вернуть в Директ как офлайн-конверсии.
Куда приходят заявки
Когда посетитель оставляет контакт, Kryps создаёт заявку с именем, телефоном и кратким пересказом разговора. Заявка уходит в amoCRM, Битрикс24 или другую подключённую CRM. Если CRM нет, она появится во встроенной CRM Kryps, а уведомление придёт на почту, в Telegram или MAX. Менеджеру не нужно переспрашивать клиента: в карточке видно, что тот хотел и на каком этапе разговора оставил телефон.
Частые ошибки при установке на Tilda
Код вставили, но чата нет
Почти всегда причина в том, что страницы не опубликованы заново. Нажмите "Опубликовать все страницы" и обновите сайт с очисткой кэша.
Чат есть только на одной странице
Код добавлен через блок T123 на одной странице, а не в общие настройки сайта.
Ассистент отвечает общими словами
На сайте мало текста или информация спрятана в картинках. Дополните базу знаний вручную: цены, условия, сроки, ответы на частые вопросы.
Чат перекрывает другую кнопку
Если на сайте уже стоит виджет обратного звонка или кнопка мессенджера в том же углу, уберите один из них. Два плавающих элемента рядом путают посетителя.
Персональные данные
Ассистент собирает телефон и почту, поэтому на сайте должна быть ваша политика обработки персональных данных. Ссылку на неё укажите в настройках виджета: она появится под полем ввода в чате. Kryps обрабатывает данные посетителей по вашему поручению и перед отправкой в языковую модель заменяет телефоны и адреса почты на метки.
Частые вопросы
Замедлит ли чат сайт на Tilda?
Скрипт подключается с атрибутом async и грузится после основной части страницы, поэтому на скорость первого экрана он заметно не влияет. Сам чат открывается в отдельном изолированном слое и не меняет стили вашего сайта.
Можно ли поставить чат только на одну страницу Tilda?
Да. Вместо общих настроек сайта вставьте код через блок T123 только на нужную страницу и опубликуйте её.
Работает ли чат на мобильной версии Tilda?
Да. На телефоне чат открывается почти на весь экран, кнопки под приветствием удобно нажимать пальцем, а клавиатура не перекрывает поле ввода.
Нужно ли менять код, если я поменял текст или цены?
Нет. Код остаётся тем же. Обновите базу знаний в кабинете или запустите повторный сбор с сайта, ассистент начнёт отвечать по новым данным сразу.
Сколько стоит чат-бот для Tilda?
Kryps работает одинаково на любом конструкторе. Первые 7 дней бесплатно, дальше тариф Start за 1 490 руб. в месяц для одного сайта и 500 диалогов, тарифы с интеграцией CRM начинаются с Business за 3 990 руб. в месяц.