Skip to main content

Kак настроить пошаговую форму Как сделать квиз 2863675

Kак настроить пошаговую форму_ Как сделать квиз_

ID: 2863675 URL: https://intercom.help/platformalp/ru/articles/2863675-kак-настроить-пошаговую-форму-как-сделать-квиз Updated: 1707330560

Содержание:

1. Как создать простой квиз?
2. Настройки «Пошаговой формы»

Функция пошаговой формы позволяет разделить длинную форму на несколько частей (шагов), которые перелистываются кнопкой «Далее» . Это удобно использовать, если посетителю нужно выбрать много параметров товара/услуги и в конце указать свои контакты.

Пример квиза или пошаговой формы, которую будем делать в этой инструкции:
http://koto-quiz.plp7.ru/

1. Как создать простой квиз?

Шаг 1. Добавим на секцию виджет «Новые формы ».

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

Шаг 2. Удалим предустановленные поля, заголовок и кнопку.

Шаг 3. Перейдём в «Настройки формы » во вкладку «Шаги » и включим пошаговую форму.

Шаг 4. Добавим нужное количество шагов для формы и изменим их «Название ».

Шаг 5. Перейдём к первому шагу. Для этого нажмите на иконку перекрестия возле настроек формы и на нужный шаг:

и начнем наполнять нашу «Пошаговую форму »

На первом шаге мы добавим:
Виджет «Текст »
Виджет «Картинка »
Виджет «Кнопка » с действием «Перейти к следующему слайду, вкладке или шагу »
Именно данное действие в кнопке будет перелистывать шаги вперёд.

Шаг 6. На втором шаге формы мы добавим поля для заполнения:
«Поля для новых форм – Имя »
«Поля для новых форм – Телефон »

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

Шаг 7. На второй шаг формы тоже добавим кнопку, которая будет перелистывать к следующему шагу.

💡Подсказка: Если шагов много, то настроенную кнопку можно «Дублировать » и разместить на нужных шагах формы.

Шаг 8. На третьем шаге нам понадобится виджет «Кнопка » с действием «Вернуться к предыдущему слайду, вкладке или шагу ».
Для этого дублируем нашу кнопку «Далее » и изменим: «Цвет », «Название » и «Действие ».

Шаг 9. На последнем шаге, где будет производиться отправка формы, необходимо установить виджет «Кнопка » с действием «Отправить форму или перейти к следующему шагу ».

❗Обратите внимание, что в последнем шаге тоже должны быть виджеты «Поле» и «Кнопка», чтобы отправить форму, а не еще один, отдельный виджет формы.

Квиз готов! Останется только опубликовать страницу и проверить его работу.

💡Подсказка! В качестве оформления можно использовать любые виджеты с панели инструментов.

2. Настройки виджета «Пошаговой формы»

Перейдем в настройки пошаговой формы, нажав иконку гаечного ключа и выбрав «Шаги»

Плавное перелистывание влево и вправо – позволяет плавно перелистывать шаги в форме.
Пример: http://koto-quiz1.plp7.ru/

Одинаковая высота для всех шагов – задаст одно значение высоты для всех шагов в этом виджете.
Пример: http://koto-quiz2.plp7.ru/
​

Нумерация шагов – позволяет задать, с какого шага начинается нумерация шагов (с первого шага или со второго) и на каком шаге заканчивается (на последнем шаге или на предпоследнем):

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

Более сложные примеры можно найти в нашем Блоге:

Готово!🎉 Мы создали и настроили квиз-форму 👍

Back to top