How to Set a Scroll Delay Trigger in Divi Overlays

Thanks to the newly released Divi Overlays 2.0, you can now trigger overlays automatically with our suite of Automatic Triggers. One of these of course is the ability to trigger overlays based on how much of the page the user has scrolled.

This is extremely easy to set up in Divi Overlays, so just follow the steps below.

First, navigate to the overlay edit screen for the Divi Overlay that you’d like to apply the scroll delay automatic trigger for.

Next, scroll down until you see the box for “Automatic Triggers.” Select Scroll Percentage, and specify (either in pixels or percentage) when you want the overlay to trigger, based on how much of the page the user has scrolled.

For example, for this tutorial, I’m going to type in 1000px in the ‘From’ field, which will automatically trigger the overlay when the user has scrolled to 1000px down from the top.

In most cases, you’ll want to leave the ‘To’ field blank. Adding a value in the ‘To’ filed will automatically close the overlay, once the user has reached that part of the screen. In order for this option to work, you’ll need to make sure the “Prevent main page from scrolling” option is not enabled.

Next, you’ll need to decide whether you want the overlay to automatically trigger on “All pages” or “Only specific pages” and choose the option from the dropdown.

If you choose “Only specific pages,” then select or start typing the name of the page/post/custom post type that you’d like the overlay to be displayed on. You can repeat this step to add it to multiple pages.