How to Implement Conditional Logic on WordPress Forms

How to Implement Conditional Logic on WordPress Forms

Would you like to show/hide form fields depending on user answers?

Conditional logic of the WordPress Form Maker plugin allows you to create smart, user-friendly forms with complex logic. You can show the user only what they need to see and keep the forms short and straightforward. In other words, depending on the options they choose, the users see only those fields that are related to their chosen values. Employing conditional logic renders significantly more simple and comprehensible forms.

Keep in mind, however, that conditional logic works only on the premium version of this plugin. If it’s something you will use on your site often, you can read up on the pricing scheme, conditions, and additional functionality on our site.

Creating forms using conditional logic

Let’s get started by creating the form with the WordPress Form Maker. From the submenu of the plugin go to the

> Forms page,

> choose an already-created form or create a new one by following the steps in this guide.

Note: Make sure to add all necessary fields to your form.

> Navigate to “Form options” of your form,

> Click on the “Conditional fields” tab.

Press ”Add Condition” button to configure the first condition of your form. The options to configure the conditional logic will appear.

Let’s go through all of them one by one:

1. Set the action of the condition to: Show or Hide,

2. Choose the field to which that action will refer to,

3. Choose in which case the condition should occur: if all or if any of the selections match.

Click the little Plus (+) icon to add the statement of your form condition.

  1. Select the field that you would like this logic to depend on.
  2. Select which logical comparison you would like to check:
  • is,
  • is not,
  • like,
  • not like,
  • empty,
  • not empty.

3. Select or fill in the value that the field should contain for the assigned condition to apply.

Now let’s consider two examples of conditional logic:

  • Simple Conditional Logic;
  • Complex Conditional Logic (applying conditional logic to a field with its own conditional logic).

Simple Conditional Logic

Let’s consider the case when you are asking the user to choose the means of communication after they contact your team.

The condition you configure needs to have the following logic:

The user will see the field asking for his or her email/phone number only if he or she chooses email/phone as a preferred method of communication. Go ahead and set up the first condition for emails:

[Show] [Email field] if [all] of the following match:

[Means of communication] is [Email]

and then add the second condition to show the phone field:

[Show] [Phone field] if [all] of the following match:

[“Means of communication”] is [Phone]

Complex Conditional Logic

For instance, you want to show the field “Means of communication” (with its own conditional logic that we have created in the section “Simple Conditional Logic”) if the age of the user is 25 and he/she lives in Tokyo. Let’s also assign the form to show the reason for rejection in case the conditions are not fulfilled.

The conditions you configure need to have the following logic.

Condition 1: (the user lives in Tokyo and is 25 years old)

[Show] [“Means of communication” ] if [all] of the following match:

[Age] is [25]

[City] is [Tokyo]

Condition 2: (If the above statement is true, hide the Reason)

[Hide] [Reason] if [all] of the following match:

[Age] is [25]

[City] is [Tokyo]

Condition 3: (If the user lives in Tokyo and is 25 years old, we need to receive contact info)

[Show] [Email field] if [all] of the following match:

[Means of communication] is [Email]

and add the second condition to show the phone field:

[Show] [Phone field] if [all] of the following match:

[Means of communication] is [Phone]

Congrats! We have just created a form with complex conditional logic.

You can check out other user-friendly and advanced functionalities of this WordPress form builder plugin here or learn how to create a donation form on WordPress. Do write below if you run into any difficulties, and we’ll promptly help you out!

Edita Nazaryan
Edita Nazaryan
Edita is a Technical Support Representative at 10Web. She is passionate about sharing her knowledge and experience with others since she believes that the "future is created by what we do today, not tomorrow."

Leave a comment

Your email address will not be published. Required fields are marked *

Your email address will never be published or shared. Required fields are marked *

COMMENT

NAME *

WEBSITE

Cancel reply