Blur Effect & Locking Content
The blur effect creates a visual overlay on the page background behind your widget, drawing attention to the widget content. It is available for scroll boxes, pop-ups, and floating bars.
To enable it, toggle Enable blur effect in your widget settings.
---
Blur Effect Intensity
After enabling the blur effect, adjust the intensity bar to control how strong the blur appears. A higher percentage creates a more opaque, heavily blurred background.
---
Locking Content
You can use Popup to lock page content behind a form submission, requiring visitors to interact with the widget before accessing the content below.
For Inline Widgets
- Toggle on Lock All Content Below in the widget settings
- Place the inline widget above the content you want to blur and lock
Everything below the widget will be blurred until the visitor completes the form.
For Pop-ups
- Enable the blur effect
- Under Close Button Location, select "none" to remove the close button
- Toggle off "Overlay should close the widget"
This prevents the visitor from dismissing the pop-up without completing the form, effectively gating the page content.
---
Blur Effect over a Specific Element
To apply the blur only when a visitor scrolls to a specific section of the page:
- Enable the blur effect on your widget
- In Display Rules, add the condition: "A visitor is scrolling over an element that matches the CSS selector"
- Enter the CSS selector for the target section
You can combine this with a "Show Only If" rule to further control when the widget appears. For example, show the widget only if a page URL parameter doesn't match "filled" — allowing you to dismiss the blur for visitors who have already completed the form.
---
Need more help?
If you've worked through this and still need a hand, contact support — we'll dig in with you.