Если в форме заявки нужно дать посетителю выбор услуги, темы обращения или способа связи, в Contact Form 7 для этого обычно используют два типа полей: выпадающий список select и радиокнопки radio. Оба варианта подходят для фиксированного набора ответов, но ведут себя по-разному: список экономит место, а радиокнопки показывают все варианты сразу.
Ниже разберём, как добавить такие поля в форму, как задать значение по умолчанию, как правильно вывести выбранный вариант в письме и какие ошибки чаще всего мешают отправке или создают путаницу в уведомлениях.
Когда выбирать select, а когда radio
В Contact Form 7 оба поля решают одну задачу — ограничить ответ заранее заданными вариантами. Разница в удобстве для посетителя и в том, сколько места вы готовы отдать под выбор.
- select подходит, если вариантов много или форма должна оставаться компактной. Например: список услуг, городов, тем обращения.
- radio удобнее, если вариантов мало и их важно показать сразу. Например: способ связи, тип клиента, срочность заявки.
Если вариантов всего два-три, радиокнопки обычно читаются быстрее. Если вариантов пять и больше, выпадающий список чаще выглядит аккуратнее и не растягивает форму.
Как добавить выпадающий список в Contact Form 7
Откройте нужную форму в админке WordPress: Контактные формы → выберите форму → вкладка с разметкой формы. Вставлять поле удобнее через кнопку генератора тегов, но можно и вручную, если вы понимаете синтаксис.
Пример простого выпадающего списка:
[select service "Консультация" "Разработка" "Поддержка"]Здесь service — имя поля. Именно по нему Contact Form 7 связывает значение формы с письмом. Варианты в кавычках — это то, что увидит посетитель в списке.
Если нужен выбор по умолчанию, добавьте default к нужному пункту:
[select service "Консультация" "Разработка" "Поддержка" default:Разработка]В этом примере при открытии формы заранее будет выбран пункт «Разработка». Это удобно, когда у вас есть самый частый сценарий обращения и вы хотите сократить число лишних кликов.
Если нужно, чтобы пользователь сначала сделал осознанный выбор, не задавайте значение по умолчанию. Тогда первый пункт не будет выбран автоматически, и посетитель увидит список в исходном состоянии.
Пустой первый пункт и обязательность выбора
Иногда владельцы сайтов хотят, чтобы пользователь не мог отправить форму, не выбрав услугу. Для этого поле делают обязательным и добавляют пустой первый вариант. В Contact Form 7 это обычно решается через обязательность поля и отсутствие заранее выбранного значения.
Пример:
[select* service "— Выберите услугу —" "Консультация" "Разработка" "Поддержка"]Звёздочка после select делает поле обязательным. Если посетитель не выберет значение, форма не уйдёт и покажет сообщение об ошибке.
На практике лучше не путать два сценария:
- если нужен именно выбор из списка — используйте обязательный
select*; - если допустим ответ по умолчанию — задавайте
default:, но тогда пользователь может отправить форму, не меняя выбор.
Как добавить радиокнопки
Радиокнопки в Contact Form 7 создаются похожим образом, но отображаются как отдельные варианты на странице формы. Это хороший вариант для короткого списка ответов.
Пример:
[radio contact-method "Телефон" "Email" "WhatsApp"]Если нужно, чтобы один вариант был выбран сразу, используйте default::
[radio contact-method default:Email "Телефон" "Email" "WhatsApp"]Здесь по умолчанию отмечен вариант «Email». Это полезно, если вы знаете, что большинство заявок приходит именно так, и хотите упростить заполнение.
Если поле должно быть обязательным, добавьте звёздочку:
[radio* contact-method "Телефон" "Email" "WhatsApp"]В этом случае форма не отправится, пока посетитель не выберет один из вариантов. Для формы заявки это часто правильнее, чем оставлять поле необязательным и потом гадать, как связаться с человеком.
Как связать выбранное значение с письмом
После настройки формы важно проверить не только внешний вид, но и шаблон письма во вкладке Mail. Contact Form 7 отправляет в уведомление не название поля, а его mail-tag — то есть ссылку на значение, которое пользователь выбрал в форме.
Если поле называется service, в письме нужно использовать:
[service]Если поле называется contact-method, в письме вставляют:
[contact-method]Типичная ошибка — изменить имя поля в форме, но забыть поправить mail-tag в письме. В результате форма отправляется успешно, а в уведомлении вы видите пустое место или старое значение.
Проверка простая: имя в форме и тег в письме должны совпадать по названию. Если вы переименовали поле, обновите и шаблон письма, и при необходимости тему письма, если там тоже используется этот тег.
Как сделать форму понятной для заявки
Для формы заявки важен не только сам список, но и то, как он встроен в сценарий общения. Пользователь должен понимать, что именно он выбирает и зачем.
Практически это выглядит так:
- подпись поля должна быть конкретной: «Выберите услугу», «Тема обращения», «Предпочтительный способ связи»;
- варианты должны быть взаимно понятными и не дублировать друг друга;
- если выбор влияет на обработку заявки, это лучше объяснить прямо в подписи или подсказке;
- не стоит смешивать в одном поле разные сущности, например услуги и каналы связи.
Если вы собираете заявки с сайта услуг, удобнее разделить поля по смыслу: select для услуги, radio для способа связи. Тогда форма остаётся короткой, а менеджеру проще читать письмо и понимать, что именно выбрал посетитель.
Что проверить, если форма не отправляется
Если после добавления select или radio форма перестала отправляться, сначала смотрите на валидацию, а не на почту. Contact Form 7 не даст отправить форму, если обязательное поле не заполнено или если разметка поля составлена с ошибкой.
Проверьте по порядку:
- Есть ли у поля звёздочка, если оно обязательно.
- Не сломана ли структура тега: лишние кавычки, пропущенные пробелы, неверный синтаксис.
- Совпадает ли имя поля в форме и mail-tag в письме.
- Не скрывает ли тему или плагин сообщение об ошибке.
Если форма показывает сообщение об успешной отправке, но письмо не приходит, это уже другая проблема. В этом случае форма могла обработаться корректно, а сбой произошёл на этапе доставки почты WordPress, SMTP или почтового сервера. Тогда нужно отдельно проверять вкладку Mail, адрес получателя, заголовок From, настройки SMTP и, при наличии, журнал отправки писем.
Особенно осторожно относитесь к полю From. Не стоит бездумно подставлять туда адрес посетителя: многие почтовые серверы отклоняют такие письма из-за проблем с аутентификацией домена. Для ответа посетителю обычно безопаснее использовать Reply-To, а в From указывать адрес на вашем домене.
Примеры рабочих настроек
Ниже два типовых варианта, которые часто используют на сайтах услуг.
Форма с выбором услуги:
[text* your-name placeholder "Ваше имя"]
[email* your-email placeholder "Email"]
[select* service "Консультация" "Разработка" "Поддержка"]
[textarea your-message placeholder "Опишите задачу"]
[submit "Отправить"]Форма с выбором способа связи:
[text* your-name placeholder "Ваше имя"]
[tel your-phone placeholder "Телефон"]
[email your-email placeholder "Email"]
[radio* contact-method default:Phone "Телефон" "Email" "WhatsApp"]
[textarea your-message placeholder "Комментарий"]
[submit "Отправить"]Во втором примере поле contact-method обязательное, а по умолчанию выбран телефон. Это удобно, если телефон — основной канал связи, но посетитель может переключиться на другой вариант.
Как быстро проверить результат
После сохранения формы откройте страницу с формой и пройдите тестовую отправку сами. Проверьте три вещи:
- поле отображается так, как вы задумали;
- обязательный выбор действительно блокирует отправку без значения;
- в письме приходит именно тот вариант, который выбрал посетитель.
Если письмо приходит, но значение пустое, почти всегда проблема в несоответствии имени поля и mail-tag. Если форма не отправляется и подсвечивает поле, ищите ошибку в обязательности, синтаксисе тега или конфликте с темой/скриптами.
Для рабочих форм заявок этого обычно достаточно: корректно настроенный select или radio делает форму понятнее для посетителя и одновременно помогает вам получать более структурированные обращения без лишней ручной обработки.