В этой статье вы найдете информацию о том, как работать с конструктором сайт-ботов. Но для новичков мы рекомендуем изучить уроки по созданию своего сайт-бота из Квест-игры.

Создание бота

Перейдите в конструктор ботов («Инструменты» - «Сайт-бот»). Затем нажмите «Создать бота», введите название и сохраните. Перейдите в настройки сценария, нажав на кнопку «Сценарий». С этого момента можно начать создавать свой сценарий бота.

Начало создания сценария

Выберите тип блока, с которого начнется сценарий. Например, обычный текст. Это только пример, вы можете начинать свой сценарий с любого блока. Блок, стоящий на первом месте, всегда является стартовым блоком.

Блок «Обычный текст»

В блоке «Обычный текст» введите сообщение, которое пришлет бот. Здесь вы можете добавить смайл, ссылку, отформатировать текст: сделать жирным, подчеркнутым, зачеркнутым или наклонным.

При необходимости можно добавить переменную в текст, но перед этим необходимо сохранить введенные пользователем данные или создать GET-параметры.

Интерфейс блоков

В верхней части блока есть значок палитры. С помощью данной функции можно окрасить блок в цвет, чтобы визуально разделять участки сценария.

Рядом с палитрой есть значок шестеренки (опции блока). При нажатии на нее можно увидеть дополнительные настройки блока. Рекомендуем вам изучить их.

Снизу есть поле «Задержка в секундах». Это время, которое должно пройти до показа этого блока после предыдущего. В этот момент бот будет создавать видимость написания сообщения с помощью анимации трех точек. Эту анимацию можно отключить в опциях (шестеренка).

Дополнительно к блоку можно добавить комментарий. Для этого нажмите на опции блока, затем «Добавить комментарий».

Добавление нового блока

Нажмите на круглый плюс снизу и добавьте новый блок. Блок разместится рядом и будет автоматически создана связь с предшествующим блоком.

Если добавлять блок через кнопку «Добавить блок», расположенной справа, то появится спойлер с кнопками: «Отдельный блок» и «Связанный блок».

1. «Отдельный блок» подразумевает добавление блока в конце сценария без связи с другими блоками.
2. «Связанный блок» автоматически устанавливает связь с предшествующим блоком. Если последним блоком является блок «Кнопки», то выбора добавления связанного блока не будет, так как система не определит к какой именной кнопке нужно добавлять переход. В этом случае создавайте связь через круглый плюс. Если в блоке есть переход по умолчанию, то связь будет создана именно с этим переходом.

Тестирование сценария

Следите за тем, чтобы блоки были связаны между собой, иначе при работе сценария отдельные блоки показываться не будут. Обязательно тестируйте свои сценарии. Сделать это можно через кнопку «Тестировать» сверху или через кнопку «Тестировать с этого блока», расположенной в опциях блока (шестерёнка).

Блок «Кнопки»

Добавьте новый блок. Для разнообразия выберите «Кнопки». В блоке «Кнопки» вы можете добавить несколько кнопок и сделать переходы на разные участки сценария.

В этом блоке также есть и обычный текст, что позволяет при желании объединить 2 блока в один, если вы используете сначала «Обычный текст», а затем блок «Кнопки» без сообщения.

Для добавления кнопки необходимо:

1. Нажать «Добавить кнопку».
2. Ввести название кнопки. Не делайте очень длинное название кнопки. В идеале название должно содержать не более 3 слов.
3. Связать кнопку с переходом на другой блок или стороннюю ссылку. Сторонняя ссылка будет открыта в новой вкладке. 

Установка связи между блоками

Бирюзовый плюс говорит о том, что связь с данной кнопкой или блоком ещё не установлена. Нажмите на него и выберите следующий блок по сценарию.

При выборе можно воспользоваться быстрым поиском по блокам. Искать можно по тексту, номеру, типу блока, а также по личному комментарию, который добавляется через опции (шестерёнка).

После установки связи между блоками вместо плюса будет располагаться ссылка на следующий блок. Нажмите на нее и система автоматически направит вас к выбранному блоку, дополнительно подсветив его красной рамкой.

Чтобы узнать какие блоки ссылаются на определенный блок, выберите опции блока (значок шестеренки) и нажмите «Ссылающиеся блоки».

Блок «Ввод с клавиатуры»

Добавим новый тип блока «Ввод с клавиатуры». Данный блок позволит вашим посетителям вводить с клавиатуры информацию, которую вы запросите.

Сохранение введенных данных

В блоках «Кнопки» и «Ввод с клавиатуры» можно сохранять введенные пользователем данные, чтобы потом использовать их в сценарии (см. фото выше).

Переменные можно отправить в анкету VekRosta (читайте про блок «Форма» ниже). Например, если человек один раз уже ввел своё имя, то ему не придется повторно вводить его в форме регистрации.

Чтобы открыть список доступных переменных, нажмите иконку с значком (x) и выберите нужную переменную. Читайте подробнее о сохранении данных.

Добавление фильтров в блоке «Ввод с клавиатуры»

Также в блоке «Ввод с клавиатуры» можно добавить фильтры, которые будут считывать введенную пользователем информацию и отправлять его на нужный участок сценария, если его сообщение содержит слово или словосочетание фильтра. Более продвинутые условия можно создать в блоке «Условия».

В одном фильтре можно добавить несколько фраз (слов, словосочетаний и наборы символов) через запятую, а ниже установить галочку «Не учитывать регистр букв», чтобы система не проверяла входящую информацию на маленькие и большие буквы, так как люди могут вводить текст по-разному.

Например, вы можете сделать блок с паролем, в этом случае проверка на регистр букв нужна, поэтому галочку включать не нужно (но вы вправе делать как посчитаете нужным). При правильном вводе человека направит на секретный блок, в других случаях его направит на сообщение о неверном пароле, за это отвечает «Переход по умолчанию» (см. фото ниже).

Дополнительно можно установить опции:

«Не проверять знаки и символы» - введенные пользователем различные знаки препинаний, смайлики, знаки доллара «$», процента «%», звездочки «*» и прочих не будут учитываться при поиске вхождений. Для случая с паролем эту опцию ставить не нужно.

«Искать вхождения» - начиная с первого фильтра, будет идти проверка вхождений фраз в тексте пользователя. При первом совпадении человека направит на нужный участок сценария.

Рассмотрим пример ниже. Мы спрашиваем у человека «Чем вы занимаетесь?», он может ответить «Пока ничем, учусь». В этом случае человек перейдет на блок 4, так как система найдет в его тексте слово «Учусь», которое мы написали в третьем фильтре. Если посетитель введет «Я на пенсии, но учусь новому», то его отправит на блок 2, так как первое найденное вхождение является «На пенсии», которое мы указали в первом фильтре.

Блок «Условия»

В этом типе блоков можно создавать расширенные условия переходов в сценарии.

Например, мы можем спросить у человека его возраст. Если ему меньше 18, то сообщить, что предложение ему пока не доступно. И, наоборот, если больше (или равно), то он может ознакомиться с ним. Смотрите пример такого условия ниже на фото.

В блоке «Ввод с клавиатуры» мы спрашиваем возраст, сохраняем введенные данные и обязательно ставим проверку на число, так как человек может ввести возраст словом. Если поставим проверку, то система скажет посетителю правильный формат ввода.

Далее мы добавляем блок «Условия» и создаем 2 фильтра с условиями:

1. Возраст < 18. В этом случае будет переход на блок 3.
2. Возраст >= 18. В этом случае будет переход на блок 4.

Принципы работы блока «Условия»

• Сам блок не показывается в диалоге, то есть посетитель его не видит. Все условия проверяются в фоновом режиме.
• Условия проверяются сверху вниз. Если какое-то условие в начале выполняется, то следующие будут пропущены. Фильтры можно перетаскивать, удерживая крестик в виде стрелочек.
• Для числа и даты работают условия: больше «>», меньше «<», равно «=», больше или равно «>=», меньше или равно «<=», не равно «!=».
• Для строки работают условия: «Начинается с», «Заканчивается на», «Содержит», «Не содержит».
• При поиске слова или фразы в строке важен регистр букв, поэтому при необходимости поставьте галочку «Не учитывать регистр букв» внизу блока.
• В одном фильтре можно выбрать как логически будут связаны условия: либо «И», либо «ИЛИ».
  Если «ИЛИ», то переход на нужный блок срабатывает, если любое условие в фильтре выполняется.
  Если «И», то переход на нужный блок срабатывает, если все условия в фильтре выполняются.
• Если никакие фильтры не выполняются (фильтр не является истиным), то срабатывает переход по умолчанию (в самом низу блока).
• Чтобы блок «Условия» занимал меньше места, вы можете скрыть фильтры, нажав на галочку (слева сверху).

Защита от «Дурака»

Защитой от дурака называют защиту от очевидно неверных действий человека. Например, в примере выше мы спрашиваем у человека возраст, но ничто не запрещает ему написать любое число, например: 0, -100, 200. В данном примере это не очень критично, поэтому вам решать, делать такую защиту или нет.

Базовая защита у нас стоит при проверке на число. Теперь сделаем расширенную проверку с разными диапазонами (см. фото ниже).

Кроме двух стандартных условий (Возраст < 18, Возраст >= 18), мы добавили ещё несколько:

1. Возраст > 0 И Возраст <= 13. При вводе чисел из этого диапазона человека направит на блок 6.
2. Возраст >= 120. При вводе чисел из этого диапазона человека направит на блок 7.
3. Ввод отрицательных чисел обработали с помощью перехода по умолчанию. Если человек вводит число, которое не совпадает ни с одним из диапазонов, то, вероятно, это ошибочное число и посетителя направляет на блок 5, где ему предлагается повторить попытку.

Блок «Видео»

Следующий блок, который можно добавить - это видео. Чтобы добавить видео, скопируйте и вставьте ссылку на него с YouTube в специальное поле. Переход на YouTube при просмотре видео не будет доступен. Также можно полностью отключить показ рекомендованных видео в защищенном плеере.

Дополнительно можно установить таймкод для старта видео с определенного времени. Время устанавливается в секундах. Чтобы не считать самому, на YouTube под видео можно нажать «Поделиться», затем установить галочку «Начало», и в ссылке появится число для установки таймкода. Это число и нужно установить в поле «Таймкод» без символов и пробелов.

Также можно включить автовоспроизведение для компьютеров. Это позволит видео включаться автоматически без нажатия на кнопку play. Возможно останавливать видео при скрытии (галочка «Пауза при скрытии») и отключать перемотку, чтобы посетители не могли перематывать и ускорять видео.

Блок «Аудио»

Аналог аудиосообщения как в обычных мессенджерах является блок «аудио».

Здесь можно его добавить несколькими способами:

1. Записать в конструкторе ботов.
2. Загрузить файл mp3.
3. Указать ссылку на файл. 

Дополнительные опции позволяют:

• Установить автовоспроизведение аудио. Если установить галочку на несколько подряд идущих аудио, то они будут запускаться по очереди.
• Останавливать при скрытии.
• Показывать без аватара. Например, если одно аудио - голос человека, то его можно использовать с аватаром, а если обычная музыка или стороннее аудио, то можно показывать без аватара.

Блок «Картинка»

В блок «Картинка» можно установить изображения форматов: jpg, png, gif (анимация). Учитывайте, что форматы png и gif обычно много весят, поэтому обязательно сжимайте фото и уменьшайте размер gif-анимаций через специальный онлайн-сервис.

В блоке «Картинка» есть несколько полезных опций:

1. Возможность вставить картинку по URL. Это удобно, если вы часто меняете изображение. Вы можете поменять его в одном месте, а данные автоматически подгрузятся в бота. Часто используется для обложек каталогов.
2. Ввести высоту и ширину в процентах. Стоит заметить, что данная опция не уменьшает качество и размер изображений, поэтому при загрузке больших фото они будут весить столько же и грузиться очень долго, особенно на маленьких скоростях Интернета.
3. Выравнивание по центру. Изображение или gif-анимация будет располагаться в центре чата.
4. Показать без аватара. В этом случае аватар бота показываться не будет.
5. Возможность увеличить. Если картинка имеет много мелких деталий и текста, то установите эту галочку. При нажатии на фото, оно будет открываться отдельно.

Блок «js-html код»

С помощью данного блока можно установить все что угодно: таймер, кнопки поделиться, код для создания блока FAQ, квизы, слайдеры, калькуляторы, каталоги, формы подписки и другие сторонние скрипты.

Для этого просто скопируйте код на стороннем сервисе и установите его сюда. Важно: если вы устанавливаете код формы стороннего сервиса, то сайт перестанет быть реферальным, так как все анкеты будут приходить к вам. Реферальная система работает только для формы и виджета от VekRosta.

Блок «Форма»

В блок «Форма» устанавливается регистрационная форма от VekRosta. При ее заполнении все анкеты будут приходить в личный кабинет. Читайте инструкцию по настройке формы.

В форму и анкету можно отправлять все сохраненные ранее данные. Например, если вы запрашивали имя, email или страну человека, то они автоматически отобразятся в форме регистрации.

Блок «Виджет»

Виджет обратной связи от VekRosta появляется там, где он находится по сценарию. Если вы хотите, чтобы виджет отображался сразу при входе в диалог, то поставьте блок «Виджет» стартовым (первым).

Блок «FAQ»

Блок FAQ позволяет добавить спойлеры, при нажатии на которые открывается дополнительная информация. Например, в сценарии можно сделать блок FAQ с часто задаваемыми вопросами и ответами на них и разместить после формы регистрации. 

Завершение настройки сценария

Создайте сценарий бота с помощью принципов, описанных выше.

Сохраните и протестируйте свой сценарий. Затем скачайте скрипт бота и загрузите его на хостинг. Завершите настройку (установите формы регистрации, виджет обратной связи, реферальную систему). Готово!

Если у вас остались вопросы, то обратитесь в нашу поддержку или воспользуйтесь инструкциями из товара в магазине VekRosta.

Может быть интересно