Page gating controls access to content by requiring users to provide information through a form. This guide explains how to set up and manage page gates in Formulayt, including options for gating entire pages or specific page elements.
Page gate options
Formulayt offers five different ways to control access to your content:
1. Lock out page immediately
A basic page gate that appears as a modal pop-up when the page loads. Users cannot interact with any content behind the gate until they submit the form. Once submitted, the content is revealed.
2. Lock out page after a delay
This page gate appears after a specified time delay:
You must select the delay duration in seconds
Once the delay passes, the gate appears and locks the page
Users can view content briefly before being required to fill out the form
3. Lock out page after scroll
This page gate appears after the user scrolls to a certain point on the page:
You must specify the scroll threshold in pixels
Once the user scrolls past this point, the gate appears and locks the page
Useful for allowing users to preview some content before requiring form submission
4. Hide predetermined elements
This option requires your web page to be built with specific classes:
Elements to reveal on form submission must use the class:
.formulayt-pagegate-show-on-openElements to hide on form submission must use the class:
.formulayt-pagegate-hide-on-open
Page Gate Display Status
Element Class | Gate Closed | Gate Open |
.formulayt-pagegate-show-on-open | Hidden | Displayed |
.formulayt-pagegate-hide-on-open | Displayed | Hidden |
5. Hide elements using CSS selector
With this page gate type:
You must provide a valid CSS selector for elements that should be hidden
The selector must be in the same format you would use in a style sheet
Note: This option can only hide elements; it cannot reveal previously hidden elements when the gate opens