Ave - Header Meta Options

Header design options

1. Style

Ave provides different header layouts, rather than regular headers.

1. Fullscreen: With this header style, primary nav will be shown in full screen.

2. Side 1: Header will be hide in the side of the viewport. until it's trigger by "Trigger Button" module. Usually the structure is like so

and the result:

3. Side 2: If you want the navigation items to be shown always, this is the style you can go with.

2. Enable Megamenu Reaction

By enabling this option, if you have a megamenu in your nav items, by hovering over that item, the header's background will react dynamically to the background of that megamenu. Also, menu item and module colors will react to the background based on megamenu's background luminosity.

4. Enable Sticky Header

Well, you can make your header sticky pretty easy. Just enable this option.

4.1. Sticky Header Position
  1. Default - Bottom of the header: Header will stick on top of the viewport as soon as header is gone outside of the viewport.
  2. After the first section: If you want the sticky header waits until user passes the first section, you can enable this option.
4.2. Sticky Header Background

Define any background color when the header is in sticky state.

4.3. Sticky Header Color

Define the color of menu items and module text colors using this option.

4.4. Sticky Header Color

Define the hover color of menu items and module text colors using this option.

5. Overlay

By enabling this options, the header will goes on top of the first section.