Условные поля для Contact Form 7 Учебное пособие для работы с Contact Form 7 — Conditional Fields

Мы пока оставим эти опции неотмеченными и создадим нашу первую группу под названием Technical-support-selected.

Нажмите Insert Tag кнопку, чтобы вставить этот код [group technical-support-selected][/group]. Теперь вам нужно будет ввести соответствующую часть формы между закрывающим и закрывающим тегами, например:

[group technical-support-selected]
  Your operating system: [select operating-system first_as_label "-- Choose your operating system --" "Android" "iOS" "Linux" "Windows"]
  Please specify your OS version: [text version]
[/group]

Вложенные группы – обратите внимание, что группы также могут быть вложенными. Таким образом, внутри группы технической поддержки можно добавить группу с полем, в котором пользователь может указать версию своей ОС.

[group technical-support-selected]
  Your operating system: [select operating-system first_as_label "-- Choose your operating system --" "Android" "iOS" "Linux" "Windows"] 
  [group os-selected]
    Please specify your OS version: [text version]
  [/group]
[/group]

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

Добавление условной логики

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

Нажмите кнопку добавления нового условного правила и введите эту информацию:

Это правило гарантирует, что группа тех поддержки станет видимой после того, как пользователь выберет «Техническая поддержка» из раскрывающегося списка. Теперь создадим еще одно правило:

show [os-selected] if [operating-system] not equals ""

Это правило приведет к тому, что текстовое поле Версия появится после того, как пользователь выберет ОС. Мы достигаем этого, проверяя, не соответствует ли выбранный вариант в раскрывающемся списке пустой строке. (Обратите внимание, поскольку мы используем first_as_label, значение на -- Choose your operating system -- самом деле не установлено. Если мы опустим параметр first_as_label, условие будет следующим:

show [os-selected] if [operating-system] not equals "-- Choose your operating system --"

Это нормально, но нам нужно что-то более продвинутое. Если пользователь выбирает «Другое» из раскрывающегося списка, мы не хотим отображать группу [os-selected], но вместо этого мы хотим показать еще 2 поля, где они могут указать свою версию ОС.

Таким образом, нам нужно скрыть [os-selected], если выполняется указанное выше условие, И если [операционная система] не равна «Other». Для этого мы можем нажать кнопку И рядом с первым условием и заполнить поля следующим образом:

Теперь, если выбрана любая ОС (кроме «Другой»), появится группа [os-selected] .

Я надеюсь, что основы теперь ясны. Далее доработаем форму и добавим все условия.

Готовая форма

Если вы хотите воспроизвести форму в верхней части этой страницы, просто вставьте этот код формы в форму обратной связи 7.

Your name: [text your-name]
Your email address: [email your-email]

[group technical-support-selected]

  [group os-selected]

  [/group]
  [group os-other-selected]

  [/group]
[/group]
[group sales-support-selected]

[/group]

[submit "Send"]

Сохраните форму, перейдите на вкладку Условные поля и введите эти правила в текстовом представлении :

show [technical-support-selected] if [support-type] equals "Technical support"
show [sales-support-selected] if [support-type] equals "Sales"
show [os-selected] if [operating-system] not equals ""
               and if [operating-system] not equals "Other"
show [os-android] if [operating-system] equals "Android"
show [os-iOS] if [operating-system] equals "iOS"
show [os-linux] if [operating-system] equals "Linux"
show [os-windows] if [operating-system] equals "Windows"
show [os-other-selected] if [operating-system] equals "Other"

Нажмите кнопку Условия перезаписи, и вы должны увидеть следующие поля:

Сохраните форму еще раз, скопируйте шорткод Контактной формы 7 на новую страницу (если вы еще этого не сделали) и опубликуйте свою страницу. Это оно! Осталось только одно.

Настройка сообщения электронной почты

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

Мы просто хотим показать текст «Спасибо за отправку вопроса о технической поддержке», если пользователь выбрал техническую поддержку, и «Спасибо за ваш вопрос о продажах», если он выбрал Продажи. Затем мы собираемся перечислить только те поля, которые были видны во время отправки формы в таблице HTML.

Мы можем добиться такого индивидуального сообщения:

[technical-support-selected]
Thank you for submitting your technical support question
[/technical-support-selected][sales-support-selected]
Thank you for your sales question
[/sales-support-selected]

Обратите внимание, что мы открываем [sales-support-selected]тег сразу после закрытия [/technical-support-selected], это необходимо для предотвращения появления нежелательных пробелов в сообщении электронной почты.

Затем мы можем создать таблицу со всеми полями следующим образом:

table>
tr>td>your-nametd>td>[your-name]td>tr>
tr>td>your-emailtd>td>[your-email]td>tr>
tr>td>support-typetd>td>[support-type]td>tr>
[technical-support-selected]
  tr>td>operating-systemtd>td>[operating-system]td>tr>
  [os-selected]
    tr>td>versiontd>td>[version]td>tr>
  [/os-selected]
  [os-other-selected]
    tr>td>other-ostd>td>[other-os]td>tr>
    tr>td>other-versiontd>td>[other-version]td>tr>
  [/os-other-selected]
[/technical-support-selected]
[sales-support-selected]
  tr>td>continenttd>td>[continent]td>tr>
[/sales-support-selected]
tr>td>commentstd>td>[comments]td>tr>
table>

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