Посмотрите видеоурок о том, как добавить квиз на страницу или прочитайте подробную инструкцию ниже.
Блок BF918 (категория «Форма и кнопка») добавляет интерактивный тест в форме карточек с вопросами. Пройдя тест, пользователь увидит результат и послание, которое вы подготовите. Этот инструмент позволит вовлечь посетителей вашего сайта и дать им полезную информацию в игровой форме.
Тест состоит из трех частей:
1. Заголовок, описание и кнопка с призывом пройти тест.
2. Карточки с вопросами, которые последовательно сменяют друг друга после каждого ответа. Карточек может быть неограниченное количество.
3. Карточка с результатом и кнопкой возврата к началу.
Пример теста:
1. Заголовок, описание и кнопка с призывом пройти тест.
2. Карточки с вопросами, которые последовательно сменяют друг друга после каждого ответа. Карточек может быть неограниченное количество.
3. Карточка с результатом и кнопкой возврата к началу.
Пример теста:
Тест
Как хорошо вы знаете Тильду?
Проверьте, насколько хорошо вы разбирайтесь в возможностях Тильды и настройках блоков.
| Начать тест |
C чего начать создание сайта? 👋
Обложка — важный элемент сайта. Но создание сайта начинается с анализа конкурентов и исследования аудитории.
Верно!
Прототип сайта рисуется после изучения аудитории, анализа конкурентов и составления структуры
| Следующий вопрос |
| Проверить |
| Результат |
В каком году появилась Тильда? 👶
Верно!
Неверно
Неверно
| Следующий вопрос |
| Проверить |
| Результат |
Что такое Zero Block? ⚡️
Точно! В Zero Block можно нарисовать свой дизайн сайта.
Неверно. Пустая страничка в библиотеке шаблонов называется Blank page.
Неверно. Блок без контента — это блок DV05, «Дополнительный отступ».
| Следующий вопрос |
| Проверить |
| Результат |
Как отслеживать статистику сайта, созданного на Тильде? 📊
Да, но для более подробной аналитики можно подключить Яндекс.Метрику или Google Analytics.
Да, но также вы можете смотреть встроенную статистику прямо в Тильде.
Верно! Вы можете следить за показателями в Google, Яндекс и личном кабинете Тильды одновременно.
| Следующий вопрос |
| Проверить |
| Результат |
Как добавить дополнительные функции с помощью вставки HTML? 💻
Вставка HTML кода также есть внутри Zero Block.
Для вставки HTML кода также можно использовать блок T123.
Верно! Вставить HTML код можно используя блок T123 и внутри Zero Block.
| Следующий вопрос |
| Проверить |
| Результат |
Самый первый эффект анимации, который появился на Тильде ✨
Неверно, первым появился hover эффект на кнопках и ссылках в меню.
Неверно, первым появился hover эффект на кнопках и ссылках в меню.
Верно!
| Следующий вопрос |
| Проверить |
| Результат |
Оптимальный размер картинки для загрузки на Тильду? 💻
Это самый большой размер для полноэкранного изображения.
Такой формат подойдет для большинства изображений, кроме полноэкранных.
Правильный размер изображений поможет вам оптимизировать работу сайта.
Верно!
| Следующий вопрос |
| Проверить |
| Результат |
Можно ли редактировать фотографии прямо в Тильде?
Верно!
Можно. В настройках блока с фото есть встроенный редактор для изображений.
| Следующий вопрос |
| Проверить |
| Результат |
Какие шрифты можно подключить к сайту на Тильде?
Не только. Вы можете использовать библиотеку Тильды, сторонние сервисы или загрузить свой файл шрифта.
Не только. Вы также можете загрузить свой файл шрифта, воспользоваться бесплатной библиотекой шрифтов на Тильде или подключить Typekit.
Верно! Вы можете воспользоваться бесплатной библиотекой шрифтов на Тильде, загрузить свой файл шрифта, подключить Typekit или Google Fonts.
| Следующий вопрос |
| Проверить |
| Результат |
Как выглядит экспорт исходного кода на Тильде?
Верно! Вы сможете скачать исходный код проекта в виде zip-архива.
Неверно. При экспорте вы получаете статичный HTML, CSS, JS и картинки.
Неверно. При экспорте вы получаете zip-архив со статичным HTML, CSS, JS и картинками.
| Следующий вопрос |
| Проверить |
| Результат |
Что главное для создания эффективного сайта? 🙌
Неверно. Чтобы оптимизировать сайт для поисковиков, прежде всего нужен хороший контент.
Неверно. Неплохо, когда сайт выглядит необычно, но этого недостаточно.
Точно! Сайт начинается с контента.
| Следующий вопрос |
| Проверить |
| Результат |
Tilda Junior
Скорее всего вы недавно познакомились с Тильдой. Об основных функциях Тильды расскажет Справочный центр, а образовательный журнал Tilda Education поможет прокачать знания в интернет-маркетинге и веб-дизайне.
| Попробовать еще раз |
Tilda Senior
Вы неплохо разбираетесь в Тильде! Чтобы стать экспертом, поизучайте Справочный центр, а образовательный журнал Tilda Education поможет прокачать знания в интернет-маркетинге и веб-дизайне.
| Попробовать еще раз |
Tilda Expert
Здорово! Скорее всего, вы много работали с Тильдой. Знаете толк в проектировании, дизайне, интернет-маркетинге и можете сделать классный проект!
| Попробовать еще раз |
Добавление блока с тестом на страницу
В библиотеке блоков перейдите в раздел «Форма и кнопка» → BF918 Тест
Изменение заголовка и описания теста
Откройте меню «Контент» в левой верхней части блока. Нажмите на вкладку «Начало теста». Измените заголовок, подзаголовок и описание теста. Добавьте изображение.
Вы создали начало теста: заголовок, изображение, описание и кнопку с призывом пройти тест.
Создание карточек с вопросами и вариантами ответов
Добавьте новую карточку или отредактируйте существующую.
Заголовок — напишите вопрос.
Ответ — напишите варианты ответов на вопрос. У каждого вопроса может быть до 6 вариантов ответа.
Описание — комментарий ответа.
Тип вариантов ответа — выбор сколько ответов могут быть правильными: один или несколько.
Номер правильного ответа — укажите номер цифрой (1, 2, 3...6). Если вариантов несколько — перечислите через запятую.
Ответ — напишите варианты ответов на вопрос. У каждого вопроса может быть до 6 вариантов ответа.
Описание — комментарий ответа.
Тип вариантов ответа — выбор сколько ответов могут быть правильными: один или несколько.
Номер правильного ответа — укажите номер цифрой (1, 2, 3...6). Если вариантов несколько — перечислите через запятую.
Задайте результаты теста
Результаты записываются по порядку от меньшего к большему.
«Результат 1» – это результат при наименьшем проценте правильных ответов.
Максимальное количество различных результатов – 6.
В меню «Контент» блока перейдите на вкладку «Результаты».
Добавьте заголовок, описание и картинку для каждого результата.
Если вы добавите изображение только в один вариант результата, оно автоматически отобразится в остальных.
Пример.
У вас 10 вопросов и 4 результата: «плохо», «нормально», «хорошо», «отлично»
— «плохо» будет при 0-2 правильных ответах (до 25%)
— «нормально» будет при 3-4 правильных ответах (25-50%)
— «хорошо» будет при 5-7 правильных ответах (50-75%)
— «отлично» будет при 8-10 правильных ответах (75-100%)
«Результат 1» – это результат при наименьшем проценте правильных ответов.
Максимальное количество различных результатов – 6.
В меню «Контент» блока перейдите на вкладку «Результаты».
Добавьте заголовок, описание и картинку для каждого результата.
Если вы добавите изображение только в один вариант результата, оно автоматически отобразится в остальных.
Пример.
У вас 10 вопросов и 4 результата: «плохо», «нормально», «хорошо», «отлично»
— «плохо» будет при 0-2 правильных ответах (до 25%)
— «нормально» будет при 3-4 правильных ответах (25-50%)
— «хорошо» будет при 5-7 правильных ответах (50-75%)
— «отлично» будет при 8-10 правильных ответах (75-100%)
Изменение названия кнопок
Перейдите на вкладку «Другое» и измените текст всех кнопок теста.
Как изменить внешний вид теста
Перейдите в настройки блока, нажав кнопку в левом верхнем углу блока с тестом.
Основные настройки — измените цвет текста и ширину поля теста.
Стили карточек — измените фон, добавьте обводку.
Кнопки — настройте цвет, форму и тени кнопок.
Основные настройки — измените цвет текста и ширину поля теста.
Стили карточек — измените фон, добавьте обводку.
Кнопки — настройте цвет, форму и тени кнопок.
Как добавить в тест кнопки «поделиться в социальных сетях»
В меню «Контент» блока откройте подменю «Рекомендательные кнопки» и отметьте социальные сети, кнопки шаринга которых должны появится после прохождения теста.
Важно. Чтобы результатами теста можно было поделиться в Facebook, нужно зарегистрировать приложение и указать его номер в поле Facebook App ID. Ниже инструкция как зарегистрировать приложение.
Как получить Facebook App ID
Зайдите на страницу Facebook for developers https://developers.facebook.com. Нажмите на кнопку «Создать приложение».
Зайдите на страницу Facebook for developers https://developers.facebook.com. Нажмите на кнопку «Создать приложение».
Добавьте название для приложения. Оно будет отображаться на карточках шаринга.
В панели слева нажмите Настройки > Основное
На вашем сайте обязательно должны быть страницы с политикой конфиденциальности и пользовательским соглашением. Их адреса необходимо указать в соответствующих полях.
Для составления политики обработки персональных данных вы можете воспользоваться нашим конструктором.
Для составления политики обработки персональных данных вы можете воспользоваться нашим конструктором.
Выберите категорию вашего приложения, затем нажмите на кнопку «Добавить платформу».
Выберите во всплывающем окне платформу «Веб-сайт».
Введите URL-адрес страницы, на которой расположен блок с тестом.
Сохраните изменения.
Сохраните изменения.
Скопируйте ID приложения и добавьте в полe Facebook App ID в меню «Контент» блока с тестом.
Важно. Пожалуйста, не используйте блок для проведения серьезных конкурсов с призами. Блок предназначен для создания развлекательных тестов и увеличения вовлеченности посетителей сайта.
