Botlify — это конструктор, с помощью которого вы создадите собственного чат-бота, без навыков программирования и каких-либо специальных знаний. В этой статье мы расскажем об интерфейсе конструктора Botlify, о каждом из его разделов, покажем как изменить внешний вид вашего чат-бота и как буквально за пару минут опубликовать созданного бота на вашем ресурсе.
Вход
Войдите в свой аккаунт: введите email и пароль на странице Вход
Если у вас ещё нет аккаунта — создайте его вот здесь: Регистрация
Если вы забыли пароль от вашего аккаунта — измените его, пройдя по этой ссылке: Сбросить пароль

Обучающий Бот
Войдя в аккаунт, кликните по Обучающему Боту — вы попали в Редактор уже готового бота Botlify. На его примере вы увидите, как выглядит «изнутри» чат-бот и каким образом происходит взаимодействие с клиентом.

В левой части главного меню(сверху) вы видите несколько вкладок:
- Редактор
- Настройки
- Дизайн
- Пользователи
- Подключение
Подробнее о каждой из них мы расскажем ниже.
В правой части расположены три кнопки:
- Сохранить — сохраняет все изменения, которые были внесены в открытой вкладке (автосохранения нет, поэтому жмите на эту кнопку почаще)
- Предпросмотр — открывает окно предварительного просмотра созданного бота
- Закрыть — возвращает к списку ботов
Кликните по кнопке Предпросмотр в правом верхнем углу, чтобы увидеть чат-бот в действии. Пообщайтесь с ним, он расскажет вам кое-что интересное 😉

В левом верхнем углу расположены кнопки, которые обозначают режимы отображения бота:
Полноэкранный — создаётся отдельная страница с вашим ботом, которая доступна по прямой ссылке (доступен на платных тарифах). Просто скопируйте полученную ссылку и делитесь ей с кем угодно. Например:
- разместите на странице ВКонтакте, Facebook или в Instagram;
- отправляйте ссылку через сообщения в мессенджерах;
- сделайте email-рассылку с ссылкой на вашего бота.
- Оконный — чат-бот займёт всю ширину и высоту блока, в котором будет размещен. Такой вариант подойдёт для интеграции, например, с вашим лендингом: чат-бот будет размещён в конкретной части страницы. Пример использования можно увидеть на сайте https://botlify.io
- Виджет — диалоговое окно в правом нижнем углу экрана. При желании клиент может скрыть окно: останется только аватар вашего бота. При нажатии на аватар диалоговое окно снова откроется
Чтобы выйти из режима предпросмотра — нажмите кнопку Назад в верхнем правом углу экрана. Вы вернётесь в Редактор, где описана схема диалога.
Редактор
Первая вкладка — Редактор, раздел создания ботов. Работать в нашем редакторе очень просто, а дальнейшая интеграция бота с вашим ресурсом займет не больше 10 минут.
Вкладка Редактор состоит из нескольких компонентов :
- Рабочее поле редактора
- Панель строительных блоков
- Карта бота

Рабочее поле редактора
Рабочее поле редактора (правая часть экрана) — это область создания бота. Здесь выстраивается последовательность действий, которые чат-бот будет воспроизводить в процессе общения с клиентами. Последовательность действий состоит из блоков и соединений между ними. Конфигурация блоков и соединений может называться схемой бота.
- Блоки в интерфейсе редактора — это белые прямоугольники, обозначающие доступные действия. В правом верхнем углу каждого блока есть значок шестерёнки — это настройки. Про разновидности и способы использования блоков расскажем ниже, в следующем пункте.
- Соединения в интерфейсе редактора — это полупрозрачные зеленые линии, имеющие по два зелёных кружочка: один в точке начала, второй в точке конца. Соединения задают направление движения диалога от одного блока к другому. Один блок может быть соединён с несколькими другими блоками. Соединения от разных блоков могут вести к одному блоку. Чтобы создать соединение — нажмите на зеленый кружок одного блока и "протяните" линию к зеленому кружку другого блока. Созданное соединение можно удалить: кликните по выбранной зеленой линии — появится символ корзины, нажмите на него — соединение исчезнет.
Панель строительных блоков
Панель строительных блоков (левая часть экрана) — это перечень блоков, каждый из которых обозначает уникальный тип действий. В поле редактора блоки можно поместить двумя способами:
- Перетащить левой кнопкой мыши в нужное место.
- Кликнуть по блоку 2 раза левой кнопкой мыши. В этом случае блок появится на рабочем поле редактора в зоне видимости; перенесите его в нужную область самостоятельно.
Есть разные типы действий:
- Старт — это блок начала диалога, он появляется самым первым сообщением в диалоговом окне каждого вашего клиента. У одного бота может быть только один блок «Старт».
- Конец — обозначает конец диалога, после него ни один из блоков не будет воспроизведен.
- Сообщение — блок с текстовым сообщением от лица бота. Может включать переменные, смайлики, картинки, ссылки, gif и проч.
- Ввод с клавиатуры — блок, который даёт возможность пользователю ввести свой ответ. Полученные данные сохраняются в переменную. В настройках (значок шестерёнки) присваивается название для переменной, которую далее можно использовать. Пример реализации использования переменных есть в Обучающем боте (Я хочу узнать как пользоваться блоками —> Ввод с клавиатуры).
- Опции — этот блок с несколькими вариантами ответов; пользователь может выбрать только один вариант. Опции создают ветвление диалога. Добавить, удалить или изменить варианты можно в настройках блока.
- Bitrix24 — интеграция с платформой Битрикс-24. В настройках этого блока можно указать переменные, которые будут передаваться Битриксу. Подробнее про интеграцию с Bitrix24 в отдельной статье.
- E-mail — отправка электронного письма на указанный адрес. Выполнение этого блока не видно для пользователя. Может включать переменные
- Webhook - отправка данных на произвольный url-адрес.
Внизу панели строительных блоков расположены три раздела:
- Инструменты — перечень строительных блоков для создания диалога (открыт по умолчанию).
- Предупреждения — подраздел, где отображаются неточности и проблемы, которые потенциально могут стать причиной Ошибки.
- Ошибки — если при создании чат-бота что-то пойдет не так и он перестанет корректно работать, в этом подразделе появится информация об имеющихся ошибках.
Карта бота
Карта бота (внизу справа) — миниатюрное схематичное отображение всех блоков в рабочем поле. По карте удобно ориентироваться при создании больших скриптов и множественных ветвлений диалога.
Перемещайтесь по полю редактора при помощи мышки: кликните левой кнопкой мыши по любой области рабочего поля и подвиньте мышь в сторону.
Изменяйте масштаб рабочего поля при помощи колёсика мыши. Приближайте и отдаляйте блоки в редакторе прокручивая колёсико вниз и вверх соответственно.
Настройки
В этой вкладке вы можете:
- Изменить название бота — это название видно только в списке ботов, пользователь его не увидит.
- Включить или выключить вашего бота — «Текущее состояние вкл. / выкл.». Очень важный момент: для публикации бот должен быть включен.
- Настроить интеграцию с CRM — на данный момент можно настроить взаимодействие с Bitrix24. Подробнее вот в этой стать: ссыль
- Настроить совместный доступ — вышлите приглашение вашим коллегам, чтобы они тоже имели доступ к редактированию бота.
Не забывайте кликнуть по кнопке Сохранить после внесения изменений, иначе обновления не сохранятся.
Дизайн
Здесь можно изменить внешний вид бота:
- Изменить имя бота — это имя увидит пользователь в диалоговом окне.
- Выбрать аватар — графическое представление вашего бота. Загружайте только png, не более 512x512 и 256 килобайт.
- Настроить цветовую гамму
- Цвет фона диалогового окна
- Цвет границ диалогового окна
- Цвет фона сообщений
- Цвет текста
- Можно загрузить фоновое изображение. Картинка должна быть в формате .png или .jpg не более 2Mb
- Изменить отображение текста
- Шрифт: доступны Arial, Helvetica, Monospaced и Open Sans
- Размер: 12, 14, 18, 24
Результат изменений виден в виджит-версии бота, на этой же странице. Не забудьте сохранить изменения, прежде чем выйти из вкладки дизайна. Если возникли сложности — напишите нам через кнопку Поддержки.

Пользователи (аналитика)
Во вкладке Пользователи отображаются взаимодействия с вашим ботом — сессии.
- Дата
- ID пользователя
- ID сессии
- Источник — откуда пришел пользователь
- Переменные — данные, которые ввел пользователь (например, ФИО, номер телефона, электронная почта, комментарий и т.д.)

Подключение (публикация)
Когда бот готов к публикации — зайдите в эту вкладку, выберите нужный формат в меню в левой части экрана и следуйте инструкциям.