Learn how to control the sticky header functionality from the Landing Page Builder, giving you the flexibility to enhance the user experience by either keeping the header fixed (sticky) or allowing it to scroll off the screen (non-sticky).
Steps to Enable or Disable the Sticky Header:
- Access the Landing Page Builder:
Navigate to the backend and click on Event Content section. Then click the Page Builder tab. - Edit Page Builder:
Click on the 'Edit Page Builder' button seen at top right of the screen. - Access the Header:
Click 'Header' option in the Edit Page Builder drawer. - Open the Header Settings:
In the page editor, expand the Header section to access its settings and click on Section Styling section. - Locate the Sticky Header Toggle:
- Inside the Section Styling settings, find the toggle switch labeled “Enable Sticky Header”.
- By default, this option will be turned on, keeping the header fixed as the user scrolls.
- Enable or Disable the Sticky Header:
- To disable the sticky header (allowing it to scroll off the screen), toggle the “Enable Sticky Header” switch to the off position.
- To enable the sticky header again (keeping it fixed at the top of the page), toggle the switch back on.
- To disable the sticky header (allowing it to scroll off the screen), toggle the “Enable Sticky Header” switch to the off position.
- Save Changes:
Once you’ve adjusted the sticky header settings, Go back to Header from Section Styling and click Save Changes seen at the bottom to apply the update.
The header behavior will now reflect your chosen settings on both the backend and the live site.
Default Header
Sticky Header