Голосование на сайте

В данной статье рассмотрим, как создать одностраничный сайт с голосованием и привязкой телеграм-бота.

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

Голосование на сайте поможет узнать реальный процент "живых" пользователей страницы и увеличить целевую аудиторию с помощью сбора данных клиентов через привязку телеграм-бота.

Создание сайта

Основные настройки

Чтобы создать сам каркас сайта, на который будут накладываться блоки контента, перейдите во вкладку "Ответы форм" и нажмите кнопку "Создать форму":

Далее вы перейдете на страницу создания сайта с уже созданным шаблоном опроса.

Здесь нам необходимо перейти в настройки и указать в полях название сайта, название в ссылке:

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

Название в ссылке отобразит название сайта в адресной строке браузера:

Следующее поле покажет название во вкладке браузера:

Подробнее об иных настройках сайта читайте в статье "Как создать сайт".

Блоки контента сайта

Непосредственно контент сайта, на основе которого будет вестись голосование, можно внедрить как отдельным блоком, например, "Текст", "Изображение" и др., так и в универсальном блоке.

На данном этапе мы будем использовать именно универсальный блок по ряду причин:

  1. В нем можно разместить любое количество фотографий (в вашем случае, это может видео или другие элементы, которые должны быть вынесены на голосование);

  2. Помимо самих фотографий в универсальный блок можно вставить такие элементы, как текст, фигуру, аккордеон и т.д.

  1. Универсальный блок можно адаптировать под любое устройство: экран компьютера, планшета, смартфона.

  2. Универсальный блок также можно обрабатывать по высоте, что позволит туда добавить достаточное количество контента.

Подробнее о возможностях универсального блока читайте в одноименной статье.

Создаем универсальный блок:

После клика на блок, расположите нужные вам элементы в необходимом порядке. Для этого нажмите на "Добавить элемент" (см. рис 6).

Например, добавим изображение:

И расположите элемент в необходимом месте универсального блока.

Далее можно добавить необходимое количество элементов внутри универсального блока.

Например, текст:

После того, как вы расположили элементы универсального блока в нужном вам порядке, перейдите к адаптации сайта под устройства:

В данном случае все элементы, которые вы добавили в блок, присутствуют для каждого масштаба экрана. Удаление одного из них в любом масштабе приведет к удалению на основном экране.

Теперь первый универсальный блок на сайте готов. Обязательно нажмите сохранить, перед тем как закрыть вкладку.

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

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

После чего в настройках нового универсального блока расположим наши элементы для голосования:

Затем адаптируем наш универсальный блок под каждое устройство:

Теперь наш контент полностью готов. Давайте перейдем к созданию формы опроса.

Форма опроса

Поскольку мы изначально создали сайт с формой опроса, на сайте уже есть блок с формой опроса.

Теперь нам остается заполнить форму с голосованием. Для этого перейдите в настройки блока формы опроса:

Далее создадим вопрос, в котором перечислим наименование фотографий, вынесенных на конкурс:

В поле переменной пропишите необходимое значение переменной, в противном случае вы не сможете заполнить вопросы.

Далее выбираем чекбокс "Форма опроса":

Теперь пропишем уведомление о том, что голосование было учтено:

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

Авторизация на сайте перед отправкой формы

Чекбокс "Требовать авторизацию через Telegram":

Для начала привяжем домен к подключенному в проекте Telegram-боту.

Шаг 1. Перейдите в BotFather, в котором вы создавали своего телеграм-бота:

Шаг 2. Выберите телеграм-бота, которого Вам необходимо подключить к сайту, и кликните на него:

Шаг 3. Перейдите в настройки телеграм-бота:

Шаг 4. В настройках бота перейдите к домену:

Шаг 5. Кликните на "Установить домен"

Если вы уже подключали домен к боту либо Вам понадобится установить новый домен к тому же боту, вместо кнопки "Set domain" будет - "Reset domain".

Шаг 6. Отправьте боту домен, который хотите подключить к телеграм-боту: для этого в поле строки сообщения введите домен:

Это может быть как ваш личный домен, который вы получали в регистраторе доменных имен, либо вида https://salebot.site/.

На данном этапе привязка домена завершена.

После привязки домена к боту, активируйте в настройках формы чекбокс "Требовать авторизацию через Telegram перед отправкой формы":

Готово! Теперь перед отправкой формы пользователю будет показано модальное окно с авторизацией через Telegram:

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

Далее можно настроить ответное сообщение через бот клиенту, используя указанное уведомление.

Для этого перейдите в конструктор, где необходимо создать блок с условием (например, первостепенная проверка условия):

Далее укажите текст уведомления в условии, выберите тип соответствия "По наличию ключевых слов".

После чего пропишите сообщение.

Готово! Вы успешно создали свой сайт с голосованием и привязали к нему Telegram-бота.

Last updated