Divi Areas Pro 2.2.0

Default Conditions

Take full control over your Areas with the new Area Conditions that are available for all Areas and Triggers

With the release of Divi Areas Pro 2.2.0, we have introduced a brand new concept for Area conditions! With those conditions, you can decide if the automatic triggers should be enabled or not – only when all conditions are met, your automatic triggers will fire.

We have baked a powerful set of conditions into the plugin, which lets you target specific device-types, enable Areas only when a specific URL parameter is present, or the visitor arrives from a certain referrer page. Of course, all rules can be negated to trigger an Area only when not coming from a specific page or when none of the listed URL parameters are found.

To make things simple and easy for you, we prepared a set of common referrer rules to choose from: Show a Popup on pages without a referrer (e.g., when following a link from an email or opening a bookmark), only fire on internal traffic, on visitors that come from a search engine or a social media platform. Or write your own referrer rules.

Finally, we also let you schedule your Areas based on a list of date-ranges or a weekly recurring schedule! We focus on website performance when adding new features, so all conditions are 100% cache-friendly and validated via JavaScript in the visitors’ browser on demand. Only the scheduled dates are validated via an Ajax request to ensure that the condition uses your servers’ time.

Super cool, huh? You can find the new section “Default Conditions” in the “Triggers” tab of the Divi Area meta box. Besides, every automated trigger has the option to override the default conditions for highly customized trigger scenarios.

Scroll To Element

The “On Scroll” trigger just got more powerful!

The good old “On Scroll” trigger now features a brand new flag to toggle between the two modes “Scroll Distance” and “Scroll To Element”. The scroll-distance mode is the all familiar “scrolled 50%” or “scrolled 600px”, etc. This mode was part of our plugin from the very first day.

The new scroll-to-element mode lets you trigger an Area when a specific element on the page becomes visible. This is a great opportunity to trigger Areas based on the content-relative scroll progress: For example, you could trigger a Fly-In with “Read More” links, once the comment form below a post content becomes visible, or show a “Buy now?” Popup when the visitor reaches the pricing section of your sales page. And much, much more.

Other Cool Features

When you edit a Divi Area, we often find that the floating Divi Area meta box is a little in the way. So we introduced a new “collapse” mechanism to bring the Divi Area settings out of your view quickly: The collapsed meta box will now stick to the top of the page. You can still move the collapsed meta box left/right, but will never cover any content you are working on. Yay!

Automatic triggers always generate some dynamic JS code on your website, which tells Divi Areas Pro when you want to trigger an Area. With this release, we have made the dynamic JS by roughly 80% smaller, which results in even smaller HTML output, faster page load, and better caching opportunities.

Changes for Developers

New: applyFilters( "pre_init_area" )
This filter is called after a new Divi Area was created, but before it’s fully initialized.
New: applyFilters( "area_general_conditions" )
Filter the condition promise, during area initialization. This filter is called once per Area, right after the page loaded.
When all conditions are met, the trigger is initialized. When one condition fails, the trigger stays inactive for the current request.
New: applyFilters( "area_trigger_conditions" )
Filter the condition promise before a trigger is fired. This filter is called every time an automatic trigger is fired.
When all conditions are met, the Area is opened. When one condition fails, the Area stays hidden.
Changed: DiviAreaItem.isPrepared()
Checks, whether an Area is fully initialized (or prepared)!

Also, make sure to check out our updated Codex. We have added 140+ JS API definitions to the documentation to support you in creating efficient and flexible solutions!

Try Divi Areas Pro today

Sounds interesting? Learn more about Divi Areas Pro and download your copy now!
We’re actively developing the plugin and have some great features on our roadmap.

Click here for more details