Как сделать квиз на тильде

Обновлено: 04.07.2024

Привет✋, в этой статье я хочу рассказать про модификации, которые использую при создании сайтов для своих клиентов. Я поделюсь с вами, какие модификации использую, где их беру и как применяю.

Градиентные кнопки для сайтов на платформе Тильда

Данную модификацию я использую на сайтах, которые имеют определённую стилистику и заказчики хотят видеть градиентные кнопки. В тильде нет стандартной настройки, что бы сделать такую кнопку. Поэтому я использовал код, который беру с сайта michailozdemir.dev

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

У Романа много интересных модификаций для Тильды, которые можно применять на своих сайтах. Если что-то не получится, то можно всегда ему написать и попросить помощи.

Глитч в zero block на Тильде для текста

Эффект глитча в zero block на Тильде для текста

Градиентная кнопка для сайта на Тильде

Калькулятор и квиз в zero block на Тильде

Автора данного ресурса с модификациями для Тильды зовут Дмитрий. За небольшую плату можно получить доступ ко всем видео инструкциям на сайте. А если вы дружите с кодом, то и так поймёте как установить модификацию на сайт.

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


Чтобы протестировать нишу, не потратив на это ни копейки (ну, ОКей, бесплатно будет только 2 недели), собираем квиз лендинг. Хотя затрат на рекламу не получится избежать (заодно выясним соотношение затрат на рекламу с количеством пришедших клиентов). В этой статье мы расскажем, как сделать квиз на Тильде.

Собрать лендинг под квиз

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



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

На странице с настройками сайта придумываем название сайта и субдомен – к примеру, music-1.tilda.ws .







Добавляем фоновую картинку высокого разрешения (наушники здесь только из-за выбранного примера) из фотобанка. В идеале - собственную. Пишем уникальное предложение: в примере скидываем 30% за заявку. Добавляем кнопку заказа. Прописываем текстовыми блоками почту и телефон. Подгружаем логотип.


Сделать квиз

Квиз - виджет для вовлечения пользователя в интерактив. Серьезно влияет на конверсию сайта.

1 шаг - добавили три вопроса, в которых узнали о том, какие наушники хотел бы заказать пользователь.





3 шаг - прописываем текст в окне контактов.

4 шаг - включаем показ на всех платформах.

5 шаг - включаем автопоказ через 10 секунд.

7 шаг - копируем код и вставляем на сайт через HTML блок.


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

Настроить рекламу на quiz лендинг

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



Во время просмотра мы отминусовываем слова, которые к нашей теме абсолютно не подходят и выбираем те, которые подходят. Выберем штук 9-10 запросов, по которым будем показываться:

купить наушники
купить наушники в челябинске
купить беспроводные наушники
наушники купить цена
купить наушники недорого
беспроводные наушники купить +в челябинске
купить хорошие наушники
цена наушников
цена беспроводных наушников



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



Сохраняем объявление и отправляем его на модерацию. Повторяем эти действия для каждого подобранного ключа. Быстрее это можно сделать с помощью управления кампаниями через XML/XMLS.

Теперь нужно добавить рекламную кампанию в сетях - у нее больше охват и ниже цена за клик. Повторяем процесс создания кампании, но с небольшими оговорками: стратегия показа - только в сетях, в минус-фразы добавляем только самые неподходящие: ремонт, бесплатно, своими (например). И еще важно - добавить изображение.



После прохождения модерации можно оплачивать размещение и запускаться.

Подключить аналитику

Для отслеживания хода тестирования ниши и рекламной кампании подключим аналитику от Яндекса - Яндекс.Метрику. Добавляем новый счетчик. Заполняем все предложенные поля, включаем Вебвизор. Копируем номер счетчика и переключаемся на тильду.




В качестве заключения скажем, что мы не призываем отказываться от хороших многостраничных сайтов и переходить не одностраничники. Действовать нужно сообразно ситуации – лендинг с квизом оптимальный вариант для запуска сайта за 30 минут при нулевых вложениях на разработку. В среднем, конверсия таких сайтов составляет до 2-4%, но конверсия сильно зависит от предложения и качества трафика.

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

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

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

Дизайн квиза

Дизайн квиза на tilda

На тильде можно сделать как простой шаблонный дизайн за 5 минут, с простой заменой картинки главного экрана и текстов:

Так и создать более сложные дизайны с помощью zero блоков, там нужно вручную вставлять и подгонять по размерам все элементы, вручную делать адаптацию под мобильные и другие устройства. Это дольше и сложнее и требует навыков, но дизайн действительно можно сделать крутой, чего не сделать на марквизе или флексби.

Дизайн на флексби

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

Дизайн на марквизе

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

Функционал и разветвления вопросов

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

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


Перейдите в контент добавленного блока и вставьте скопированный код. Сохраните.
Обратите внимание, что блок "HTML-код" работает только на платном тарифе Tilda. То есть, чтобы квиз заработал, вам нужно сразу подключить тариф "Tilda Personal" или "Tilda Business"






Перейдите в контент добавленного блока и вставьте скопированный код. Сохраните.
Обратите внимание, что блок "HTML-код" работает только на платном тарифе Tilda. То есть, чтобы квиз заработал, вам нужно сразу подключить тариф "Tilda Personal" или "Tilda Business"


Добавьте блок с кнопкой из каталога Тильды (выберите любой из раздела "Форма и кнопка". Перейдите в "Контент".


Читайте также: