The Omniverse Header Builder allows you to create sticky headers, which remain visible as users scroll down your website. Sticky headers can be implemented in two ways: using a predefined Header Clone or a custom sticky header.
Sticky Header Types #
1. Predefined Header Clone #
The Header Clone is a simplified sticky header that displays a fixed set of elements, regardless of what is added to the default header rows.
- Always includes: Logo, Main Menu, Search, and Shopping Cart widget
- Not editable
- Ideal for a consistent sticky header layout
How to enable:
- Go to Global Header Settings → Sticky Header tab
- Enable the Header Clone option
- Choose the sticky effect (see below)
2. Custom Sticky Header #
A Custom Sticky Header allows the sticky header to display the same elements as your default header.
- Editable and flexible
- Requires disabling the Header Clone
- Enable the sticky option in the Row settings for each row you want to make sticky
This approach is useful if you want the sticky header to exactly match your default header layout.
Sticky Header Effects #
In the Global Header Settings → Sticky Header tab, you can configure the sticky behavior:
- Sticky on Scroll – The header remains fixed at the top of the screen while scrolling down.
- Slide After Scrolling Down – The header hides initially and slides down into view after scrolling.
- When this effect is selected, the Header Clone option becomes available.
Other sticky header settings include:
- Sticky Header Shadow – Adds a subtle shadow when the header becomes sticky.
- Hide When Scrolling Down – Hides the sticky header while scrolling down and shows it again when scrolling up.
This setup allows you to choose between a lightweight predefined sticky header or a fully custom sticky header that matches your default header design.
