USE CASE

Elementor Forms + Gloo

Complex Forms with Gloo form fields

More options for your Elementor forms thanks to forms extensions and fluid logic, together.

Create complex forms thanks to Forms Extensions and Fluid Logic.

Elementor Forms are great tools to gather user data. Gloo‘s Forms Extensions+ allows you to turn them into tools that go beyond that, and either gather more, and more precise data, or repurpose them entirely to have users modify other items on the same page. Imagination is the only limit when it comes to how complex you can make your forms using Forms Extensions, while always keeping UI and UX at the most efficient.

Let’s take a look.

YouTube video

In this Short Showcase we’ve created a very complex, interconnected form, that can serve as an example for any form that is built to gather very specific data from different kinds of users at different levels. The rest of the form will only show if the user writes a specific string if the first field: in this case, “yes“. In the form that follows, we’ve got a field that dynamically brings up category names, one that lets you choose multiple categories within a select field, then checkboxes to choose a post, a calendar to pick a date, and then two text fields that will add the numbers you write in them and multiply the results by two. The last two fields are a slider and a WYSIWYG text editor which will only show up if the value from the previous field is 10.

Fluid Logic Work on Elementor Forms.

Fluid Logic work on this form is extremely straightforward: we’ve built a condition that essentially reads: If the returned value in the targeted field is equal to yes, then the condition is true. We’ve then set every field to show when the condition is true, except for the WYSIWYG.

We’ve in fact built a second condition that returns as true only if the value in the range field is equal to 10. We’ve then set the WYSIWYG to show if that condition is true.

Advanced Form Fields for Elementor Forms by Gloo.

With that out of the way, let’s take a look at each form field we’ve used on this form, all part of Gloo‘s Forms Extensions+:

Dynamically return specific taxonomy terms by radio, select, and checkbox. Exclude terms at will. The second field in this form is a Terms Field too, but we’ve set the output as select, and toggled on Select2 so that any user can select and submit multiple taxonomy terms at once.

With the same return options as above, we can select specific Custom Post Types and return them as selectable options. Once again, include or exclude specific posts by ID, and even specify which taxonomy term the field should fetch posts from.

More than a simple calendar, the Date Picker Field gives you in-depth control over what dates to include or exclude, select months and years with a dropdown, and many other further customization options.

On this field we’ve showcased an advanced feature for this field: we’ve got an hidden calculation that adds the values from both fields and then a calculation that multiplies the resulting value by two. Very versatile field with plenty of options.

This field lets you set up either a range slider or a simple slider to either let your users submit a single value or an entire range of them.

An advanced text editor that lets you customize the options available to your users when it comes to writing (and submitting) more neatly-formatted messages.

This is merely a showcase of few of the very many great form fields made available by Forms Extensions+. Discover them all here.

New
updated
Fluid Dynamic
Play Video

Transforms your Elementor Forms Into Powerful Tools with Form Extensions+

Got A Question ?

We Are Here to Help
More Cases
Fluid Logic for form fields - use case
Use Cases

Elementor Forms + Fluid Logic

  • Fluid Logic
Dynamic conditions and visibility for form fields and for widgets according to form values.
Fluid Dynamic
Show or hide sections on command with Interactor
Use Cases

Elementor Sections

  • Interactor Engine
Interactor gives us multiple ways to show and hide entire sections at the click of a button.
Interactor
Interactor Dom Manipulation Use Case
Use Cases

DOM manipulation

  • Interactor Engine
Accessible frontend DOM manipulation set up from the Elementor Editor thanks to interactor.
Interactor
Dynamify Repeaters + Fluid Logic
Use Cases

Repeaters for Elementor

  • Dynamify Repeaters
Feed widgets dynamic information from backend repeaters and then show or hide them according to the number of items thanks to Dynamify and Fluid Logic.
Fluid Dynamic
interactor - replacing sections use case
Interactor Use Cases

Replacing Sections

  • Interactor Engine
Replace sections with other sections entirely using the Interactor engine.
Interactor