The Trigger tab allows you to customize Area triggers.
🤓 What is a trigger?
A trigger is an event that makes the Area visible. The most common trigger is a click-trigger, which displays a Popup when the user clicks on a certain button or element. Also, the timed-trigger is very popular and will display an Area a certain time after the page loaded.
In Divi Areas Pro you can choose between a set of automatic triggers that can be configured directly in the Trigger tab. There is no need to edit any other page or insert code anywhere.
However, there are times when you cannot use (or do not want to use) an automatic trigger. For those cases, you find additional details in the custom triggers section. More info on this is found below.
This section offers an easy and flexible way to create triggers.
Allows you to define when the Area should be displayed. If you specify multiple rules, the Area will be displayed whenever one rule is true. For example: If you add a timed trigger and an exit-intent trigger, the Area will be displayed either after the delay, or when an exit-intent is detected, whichever happens first.
Automatic Hover Triggers
- Applies to:
Similar to the section “Automatic Triggers”, but offers special options that are only available for Hover Areas.
Define, when the Hover Area should be displayed. Hover Areas have fewer trigger options than other layout types.
Choose the event that needs to happen to close the Area again.
None– The Area stays open until the user clicks a close button or the Area is hidden via the JS API.
Outside Click– Hide the Area when the user clicks anywhere outside the Area.
Mouse Leave– Hide the Area when the mouse is moved outside the Area or the trigger element.
The closing delay allows you to add a delay between the closing trigger and actually closing the Area. When the user moves the mouse back into the Area before this delay is reached, the Hover Area will stay open.
Hover Areas can be only triggered by a user interaction, like a click or mouse-enter.
🤓 Order and Label
The order of the trigger rules has no effect. Also, the trigger label (e.g., “Exit Intent Trigger”) is ignored on the front-end. Both, the order and the label are provided for organizational purposes.
This section provides some details about custom trigger implementations.
Link triggers are special URLs which you can use in any Divi Module to trigger this Area.
This section displays different CSS classes that can be used in any Divi Module to trigger the Area either on click or on hover.
When using the JS API you can use any of the displayed commands to open the current Area.
Note, that Hover Areas might not display correctly when they are opened via the JS API.