Плагины пошаговой формы для WordPress

Плагины для WordPress WordSmall

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

Давайте рассмотрим небольшую подборку плагинов на WordPress для создания пошаговой формы. Два из этих плагинов работают на основе Contact Form 7. Для многих это будет удобно, так как Contact Form 7 очень популярный и установлен почти на каждом 2-м сайте. А последний является полностью самостоятельным плагином, независимый ни от кого.

Multi Step – Addon for Contact form 7

wp пошаговая форма

Скачать Демо

Несложное, в плане применение, дополнение к форме, которое поможет реализовать мультиформу. Устанавливается как обычный плагин. После активации, в создании шаблона формы (Contact Form 7 – Добавить новую), у вас появится новый параметр (кнопка) Step.

Она как раз и будет служить разделением полей, создавая пошаговую форму. То есть там, где нужно сделать шаг, вы жмете на кнопку Step и встраиваете тег разделения. У плагина есть настройки: цвет кнопки, текста. Но они доступны только в платной версии, а в остальном всего хватает до полноценного использования.

Contact Form 7 – Conditional Fields

мульти степ

Скачать Демо

У этого плагина пошаговая концепция устроена немного иначе. В ней связываются поля и в зависимости от выбранного пункта появляются новые поля для заполнения. К примеру, у нас есть выпадающий список с выбором доставки товара. В этом списке есть пункт «Другое», и вот когда его выбирают, открывается новое поле, где пользователь сам может написать, как и чем доставить.

Настройка Conditional Fields (кратко)

Настройки плагина могут показаться затруднительными. Было бы неплохо для него написать отдельный обзор, а так в вкратце объясню. Поля формы прячутся в тегах [group group-1][/group] и могут иметь разный уровень вложения. У каждой группы [group group-name][/group] должно быть индивидуальное название, чтобы потом именно ей можно было задавать условие.

Вот пример формирования группы:

<b>Выберите цвет</b>
[select menu-555 "Черный" "Белый" "Жёлтый" "Свой"]
[group group-color]
    [text your-subject]
[/group]

Это обычный выпадающий список, пока что без каких-либо условий. После того как вы вставите этот код в поле «Шаблон формы», перейдите во вкладку «Conditional fields». И в этом разделе вы создаете условие.

Conditional Fields настройка

Описание скриншота: в поле Show выбирается группа, которая будет появляться при соблюдении следующего условия. В поле if (условие) выбираем элемент формы, в нашем случае это menu-555, который нужно связать с группой. В поле equals/not equals (равно/не равно) выбираем условие, при котором группа будет появляться, при определенном значении, или наоборот, исчезать. Нам подходит равно. И последнее поле value. В нем указывается тот пункт меня, при выборе которого, появится дополнительное поле (группа). В нашем случае это пункт «Свой».

Multi Step Form

плагин пошаговой формы

Скачать Демо

Этот плагин представляет из себя конструктор пошаговой формы. В нем есть все необходимые поля: почта, телефон, загрузка файлов и прочее. Каждому шагу можете дать название, добавить описание. Интерфейс плагина интуитивный: все находится под рукой. В общем, сложностей с настройками быть не должно. Тестируйте, пробуйте и выбирайте подходящий под ваши нужды.

Автор, он же Андрей, он же Admin, он же WordSmall

Лентяй-любитель, окончил высшую школу безделья с многочисленными знаками отличия. Создатель этого небольшого «чудо-блога» о еще более «чудном» контенте.

Подписаться на новые статьи
Добавить комментарий
bold quote code