Голосование на сайте
В данной статье рассмотрим, как создать одностраничный сайт с голосованием и привязкой телеграм-бота.
Last updated
В данной статье рассмотрим, как создать одностраничный сайт с голосованием и привязкой телеграм-бота.
Last updated
Если вам необходимо повысить взаимодействие со своими клиентами, а также узнать их мнение и понять, в какую сторону необходимо развивать свой бизнес-проект, то одним из действенных инструментов является безусловно опрос аудитории.
Голосование на сайте поможет узнать реальный процент "живых" пользователей страницы и увеличить целевую аудиторию с помощью сбора данных клиентов через привязку телеграм-бота.
Чтобы создать сам каркас сайта, на который будут накладываться блоки контента, перейдите во вкладку "Ответы форм" и нажмите кнопку "Создать форму":
Далее вы перейдете на страницу создания сайта с уже созданным шаблоном опроса.
Здесь нам необходимо перейти в настройки и указать в полях название сайта, название в ссылке:
Поле с названием в списке отобразится в списке уже созданных сайтов - так вам будет удобнее просматривать, прежде всего, просматривать получаемые данные с опроса во вкладке "Ответы форм".
Название в ссылке отобразит название сайта в адресной строке браузера:
Следующее поле покажет название во вкладке браузера:
Подробнее об иных настройках сайта читайте в статье "Как создать сайт".
Непосредственно контент сайта, на основе которого будет вестись голосование, можно внедрить как отдельным блоком, например, "Текст", "Изображение" и др., так и в универсальном блоке.
На данном этапе мы будем использовать именно универсальный блок по ряду причин:
В нем можно разместить любое количество фотографий (в вашем случае, это может видео или другие элементы, которые должны быть вынесены на голосование);
Помимо самих фотографий в универсальный блок можно вставить такие элементы, как текст, фигуру, аккордеон и т.д.
Универсальный блок можно адаптировать под любое устройство: экран компьютера, планшета, смартфона.
Универсальный блок также можно обрабатывать по высоте, что позволит туда добавить достаточное количество контента.
Подробнее о возможностях универсального блока читайте в одноименной статье.
Создаем универсальный блок:
После клика на блок, расположите нужные вам элементы в необходимом порядке. Для этого нажмите на "Добавить элемент" (см. рис 6).
Например, добавим изображение:
И расположите элемент в необходимом месте универсального блока.
Далее можно добавить необходимое количество элементов внутри универсального блока.
Например, текст:
После того, как вы расположили элементы универсального блока в нужном вам порядке, перейдите к адаптации сайта под устройства:
В данном случае все элементы, которые вы добавили в блок, присутствуют для каждого масштаба экрана. Удаление одного из них в любом масштабе приведет к удалению на основном экране.
Теперь первый универсальный блок на сайте готов. Обязательно нажмите сохранить, перед тем как закрыть вкладку.
Блок контента, где будут выставлены элементы для голосования, также создадим с помощью универсального блока: для этого добавьте еще один блок с помощью данной функции:
Для этого жмите на плюс и добавляйте необходимые блоки контента сайта: ограничений для добавления блока определенного вида нет - можно составить сайт, например, добавив несколько блоков одного типа.
После чего в настройках нового универсального блока расположим наши элементы для голосования:
Затем адаптируем наш универсальный блок под каждое устройство:
Теперь наш контент полностью готов. Давайте перейдем к созданию формы опроса.
Поскольку мы изначально создали сайт с формой опроса, на сайте уже есть блок с формой опроса.
Теперь нам остается заполнить форму с голосованием. Для этого перейдите в настройки блока формы опроса:
Далее создадим вопрос, в котором перечислим наименование фотографий, вынесенных на конкурс:
В поле переменной пропишите необходимое значение переменной, в противном случае вы не сможете заполнить вопросы.
Далее выбираем чекбокс "Форма опроса":
Теперь пропишем уведомление о том, что голосование было учтено:
После того, как вы установили необходимые настройки, можно перейти к привязке телеграм-бота к вашему сайту для авторизации при отправке голоса.
Чекбокс "Требовать авторизацию через Telegram":
Для начала привяжем домен к подключенному в проекте Telegram-боту.
Шаг 1. Перейдите в BotFather, в котором вы создавали своего телеграм-бота:
Шаг 2. Выберите телеграм-бота, которого Вам необходимо подключить к сайту, и кликните на него:
Шаг 3. Перейдите в настройки телеграм-бота:
Шаг 4. В настройках бота перейдите к домену:
Шаг 5. Кликните на "Установить домен"
Если вы уже подключали домен к боту либо Вам понадобится установить новый домен к тому же боту, вместо кнопки "Set domain" будет - "Reset domain".
Шаг 6. Отправьте боту домен, который хотите подключить к телеграм-боту: для этого в поле строки сообщения введите домен:
Это может быть как ваш личный домен, который вы получали в регистраторе доменных имен, либо вида https://salebot.site/.
На данном этапе привязка домена завершена.
После привязки домена к боту, активируйте в настройках формы чекбокс "Требовать авторизацию через Telegram перед отправкой формы":
Готово! Теперь перед отправкой формы пользователю будет показано модальное окно с авторизацией через Telegram:
После того как пользователь авторизуется через Telegram и отдаст свой голос, в разделе клиенты от каждого зарегистрированного пользователя придет уведомление следующего вида:
Далее можно настроить ответное сообщение через бот клиенту, используя указанное уведомление.
Для этого перейдите в конструктор, где необходимо создать блок с условием (например, первостепенная проверка условия):
Далее укажите текст уведомления в условии, выберите тип соответствия "По наличию ключевых слов".
После чего пропишите сообщение.
Готово! Вы успешно создали свой сайт с голосованием и привязали к нему Telegram-бота.