CF7 Skins Logic allows you to add Conditional Logic to Contact Form 7 forms.
With CF7 Skins Logic you can
- dynamically change the form fields displayed based on user input
- show or hide form elements depending on the values input in other form fields
- display selected form items in response to options chosen
Options
- Show or Hide – fields
- Criteria – field, user and post info
- Value – equals, not equals, contains or changed
- Compare – numeric or text values
- Multiple logic statements – if all & if any
- Multiple fields with varying logic
CF7 Skins Logic works right within the Contact Form 7 plugin interface – it adds an extra tab where you can configure each Contact Form 7 form to show or hide fields based on user selections.
Conditional Logic for Contact Form 7
Using CF7 Skins Logic
1. Select & Add Field
2. Choose “Show or Hide” plus “All or Any”
If you have some hidden fields in your form, be careful when using this feature to make sure you do not hide required fields. Contact Form 7 tests if all fields marked as required have suitable values regardless of whether the fields have been hidden by CF7 Skins Logic.
So, if a required field is hidden & not completed by the user, Contact Form 7 will show an overall validation error but the individual field & associated validation error will be hidden. This is typically very confusing for form users.
So it is generally better to not hide any fields which are also required fields in Contact Form 7.
3. Select Criteria, choose Comparison & add Value
4. Add Additional Statements & Fields
Notes
- Requires at least Contact Form 7 Skins v1.2.1
- Each CF7 Tag needs to be within a < li > statement to be detected in CF7 Skins Logic
- You’ll get more comprehensive styling if you select one of our CF7 Skins Templates (rather than the default Contact Form 7 layout) to work together with one of our CF7 Skins Styles
- Requires the CF7 Skins Pro plugin to operate – you will need to also purchase the CF7 Skins Pro plugin to use the CF7 Skins Logic Add-on
- Conditional Logic can also be added within CF7 Skins Multi forms
Examples
Show & Hide Form Fields
Show extra fields as a user fills in the form
Instructions – start typing in the Name field to see the form expand to include Message field.
Form Logic
Compare Field Values to Set Criteria
Display additional questions based on user input
Instructions – additional questions are displayed based on your answer to the first question.
Form Logic
Multiple fields with multiple logic statements
Dynamically change multiple form fields based on the values input in other form fields
Instructions – Additional questions are displayed based progressively based on individual Sports Preferences.
Form Logic