How to create a fixed header
- Go to ‘Customise’ in the top Admin bar of the website frontend.
- Go to ‘Header’ > ‘Header layout’ and locate the Fixed header field, where you can select your preferred setting.
Disabled
When the fixed header is disabled, the Hide Header Until Scroll setting controls its behavior.
- Disabling causes the header to disappear as the user scrolls down the page.
- Enabling hides the header on page load. As the visitor scrolls down, the full header slides into view at a customisable scroll distance, becoming a fixed header that remains visible.
Fade in
After the header scrolls out of sight, a vertically narrow version of the header fades in with a smaller header logo text or image.
Shrink
In the Shrink fixed header, the topbar and full header layout stay in view but the vertical space between items in the header shrinks.
Fixed
The header and top bar remain at full size and stay anchored at the top while the page is scrolled.