Как настроить условную логику в форме
Условная логика в форме нужна тогда, когда один и тот же набор полей не подходит всем посетителям. Один человек оставляет короткую заявку, другой заполняет бриф с деталями, третий отвечает на опрос и должен видеть только относящиеся к нему вопросы. Если сделать одну длинную форму для всех, часть пользователей бросит её на середине, а вы получите лишние или пустые ответы.
Суть настройки простая: форма реагирует на ответ в одном поле и меняет набор следующих полей, их обязательность, порядок или видимость. На практике это чаще всего реализуют в конструкторах форм через правила вида «если выбрано значение A, показать поле B; если выбрано значение C, скрыть блок D». В WordPress это обычно делается внутри плагина формы, а не через CSS: стили могут скрыть элемент визуально, но не управляют логикой отправки и валидации.
Когда условная логика действительно нужна
Не каждая форма выигрывает от усложнения. Условная логика полезна, если вам нужно собрать разные данные в зависимости от сценария, но не заставлять всех заполнять всё подряд.
Типичные случаи:
- заявка на услугу, где набор вопросов зависит от типа услуги;
- бриф, в котором для одного направления нужны одни детали, для другого — другие;
- опрос с ветвлением, когда следующий вопрос зависит от предыдущего ответа;
- форма обратной связи, где при выборе «проблема с оплатой» появляются поля для номера заказа, а при выборе «техническая ошибка» — поля для описания браузера и устройства;
- форма записи, где дополнительные поля нужны только для конкретной категории клиента.
Если логика сводится к одному дополнительному полю, можно обойтись обычной формой. Если же у вас три-четыре сценария и у каждого свой набор данных, условная логика экономит время и пользователю, и вам.
Сначала продумайте сценарий, а потом настраивайте правила
Самая частая ошибка — начинать с кнопок в плагине, не продумав структуру. В итоге поля появляются в случайном порядке, часть из них дублируется, а обязательные вопросы блокируют отправку там, где они не нужны.
Перед настройкой полезно расписать форму на бумаге или в таблице:
- какой первый вопрос определяет ветку;
- какие поля нужны в каждой ветке;
- какие из них обязательны;
- какие поля можно скрывать до выбора ответа;
- нужно ли показывать пояснение или пример заполнения;
- куда должны уходить данные после отправки.
Например, для заявки на услуги можно построить такую схему: сначала пользователь выбирает тип запроса, затем видит только релевантные поля. Для «разработка сайта» — бюджет, сроки и CMS. Для «поддержка сайта» — адрес сайта, доступы и описание проблемы. Для «дизайн» — ссылки на примеры и пожелания по стилю. Это лучше, чем показывать всем сразу все поля.
Как настроить условную логику в WordPress-форме
Конкретные названия пунктов меню зависят от плагина, но логика настройки почти всегда одинаковая. Ниже — рабочая последовательность, которая подходит для большинства современных конструкторов форм в WordPress.
1. Создайте базовую форму без лишних полей
Сначала добавьте только те поля, которые нужны всем без исключения: имя, контакт для ответа, основной выбор сценария и, при необходимости, комментарий. Не включайте сразу все возможные вопросы — именно они обычно делают форму тяжёлой и неудобной.
Если форма собирает персональные данные, сразу продумайте, какие поля действительно обязательны. Чем меньше лишних данных вы запрашиваете, тем проще пользователю и тем безопаснее хранение информации.
2. Добавьте поле, которое будет управлять веткой
Условная логика обычно строится вокруг одного управляющего поля. Это может быть:
- выпадающий список;
- радиокнопки;
- чекбоксы, если можно выбрать несколько вариантов;
- переключатель «да/нет».
Для ветвления чаще всего удобнее радиокнопки или список. Они дают однозначный ответ, а значит, правила проще и надёжнее. Чекбоксы подходят, если пользователь может выбрать несколько направлений сразу, но тогда логика становится сложнее: одно поле может показать сразу несколько блоков.
3. Создайте поля или блоки, которые будут появляться по условию
Добавьте все поля, которые нужны в разных сценариях, и сгруппируйте их по смыслу. Если плагин позволяет объединять поля в секции или группы, используйте это: так проще управлять видимостью целого блока, а не каждого поля по отдельности.
Для брифа это особенно удобно. Например, блок «Информация о проекте» можно показывать только тем, кто выбрал разработку сайта, а блок «Технические доступы» — только тем, кто выбрал поддержку.
4. Настройте правила показа и скрытия
В интерфейсе плагина ищите настройки вида Conditional Logic, Logic, Rules, Show/Hide или похожие. Обычно правило строится так: поле A равно значению X, тогда показать поле B. Иногда можно задать несколько условий сразу: показать блок только если выполнены все условия или хотя бы одно из них.
Практически важны три момента:
- правило должно срабатывать после выбора значения, а не только после отправки формы;
- скрытые поля не должны мешать отправке, если они не нужны в текущей ветке;
- если поле становится обязательным только в одной ветке, обязательность тоже должна включаться условно.
Если плагин не умеет делать поле обязательным по условию, лучше не пытаться обходить это только визуальным скрытием. Пользователь может не увидеть поле, а сервер всё равно потребует его заполнить, и форма начнёт ломаться.
5. Проверьте, что скрытые поля не попадают в отправку лишними данными
После настройки откройте форму в браузере и пройдите все сценарии по очереди. Проверьте не только внешний вид, но и результат отправки: какие данные пришли на почту, сохранились ли в записи формы, ушли ли в CRM или таблицу.
Особенно важно проверить, что:
- скрытые поля не отображаются пользователю;
- скрытые поля не требуют заполнения;
- в уведомлении не появляются пустые или мусорные значения;
- в интеграцию передаются только нужные поля.
Если форма отправляется в CRM или через вебхук, проверьте соответствие названий полей. Иногда логика работает в интерфейсе формы, но внешняя система получает пустые значения из-за неверного сопоставления.
Какой тип поля лучше выбрать для ветвления
Выбор управляющего поля влияет на удобство и на точность логики. Ниже — короткое сравнение, которое помогает не ошибиться с первым шагом.
| Тип поля | Когда подходит | Что учесть |
|---|---|---|
| Радиокнопки | Когда нужен один ответ из нескольких | Самый понятный вариант для ветвления, особенно на мобильных устройствах |
| Выпадающий список | Когда вариантов много и нужно сэкономить место | Чуть менее заметен, чем радиокнопки, поэтому важна понятная подпись |
| Чекбоксы | Когда можно выбрать несколько сценариев | Логика усложняется, если один пользователь может попасть сразу в несколько веток |
| Переключатель да/нет | Когда есть только два сценария | Удобен для простых развилок, но не для сложных анкет |
Для большинства заявок и брифов лучше начинать с радиокнопок. Они быстрее читаются, особенно на телефоне, и уменьшают риск неоднозначного ответа.
Что проверить на мобильных устройствах и в доступности
Условная логика часто ломает удобство именно на небольшом экране. На компьютере всё выглядит нормально, а на телефоне скрытые блоки сдвигают страницу, кнопки становятся слишком мелкими, а ошибки появляются не там, где их ожидает пользователь.
Проверьте несколько вещей:
- видно ли, что после выбора ответа ниже появляется новый блок;
- не уезжает ли фокус ввода в неожиданное место;
- достаточно ли крупны радиокнопки и чекбоксы для касания пальцем;
- связаны ли подписи с полями через корректную разметку;
- понятны ли сообщения об ошибках без визуальных подсказок цвета.
Если форма используется людьми с клавиатурной навигацией или вспомогательными технологиями, скрытие и показ полей должны происходить предсказуемо. Хороший плагин делает это корректно, но после настройки всё равно стоит пройти форму с клавиатуры и проверить, не теряется ли фокус.
Если условная логика не работает
Когда поле не появляется или форма не отправляется, не начинайте сразу с переустановки плагина. Сначала проверьте самые простые причины.
- Убедитесь, что правило привязано к правильному полю и правильному значению. Ошибка в одном символе уже ломает условие.
- Проверьте, не скрыто ли само управляющее поле стилями темы или сторонним CSS.
- Отключите кэширование для страницы с формой, если кэш мешает обновлению состояния полей.
- Посмотрите, нет ли конфликта с другим плагином, который меняет JavaScript на странице.
- Проверьте консоль браузера на ошибки, если форма реагирует с задержкой или не реагирует вовсе.
Если форма отправляет данные в почту, но письма не доходят, это уже не проблема условной логики. Тут нужно отдельно проверять почтовую доставку WordPress, SMTP-настройки и спам-фильтры получателя. Логика полей и доставка писем — разные части системы.
Как не усложнить форму лишний раз
Условная логика полезна, но её легко перегрузить. Если на один ответ завязано слишком много веток, форма становится трудной для поддержки: любой новый вопрос требует пересмотра нескольких правил, а пользователю сложнее понять, что от него хотят.
Практичный подход такой:
- делайте одну основную развилку в начале формы;
- не прячьте критически важные поля глубоко в сценариях, если они нужны почти всем;
- не дублируйте один и тот же вопрос в разных ветках без необходимости;
- не используйте условную логику там, где достаточно короткой формы с одним дополнительным полем;
- после настройки ещё раз пройдите форму как обычный посетитель, а не как администратор.
Если форма нужна для заявок, опросов и брифов, условная логика обычно даёт лучший результат, когда она помогает сократить путь пользователя, а не демонстрирует технические возможности плагина. Чем меньше лишних вопросов видит человек, тем проще ему дойти до отправки и тем чище будут данные, которые вы получите.