To customize the navigation for the inner pages, you have to access the Header Settings -> Inner Page Navigation section in the Customizer. It is also recommended that you have a subpage or a blog page open in the Customizer – if you have the Front Page open you won’t be able to see the changes you make.
This section is split into the following subsections:
Inner Page Navigation Options
- Transparent navigation bar – check this to make the navigation bar transparent in normal state
- Stick to top – check this to make the navigation bar stick to top when you scroll the page
- Boxed Navigation – check this to make the navigation bar the same size as other elements; by default, the navigation bar is wider
- Show Navigation Bottom Border – check this to enable a thick border under the navigation bar
- Nav bar color – this controls the color of the navigation bar, both in scrolled and normal state
Navigation Typography
- Nav menu color – this controls the text color of the menu items in normal state
- Sticky nav menu color – this controls the text color of the menu items in scrolled state
- Navigation Typography – click this to open the typography panel from where you can change the menu text:
- Font Family
- Font Variant
- Font Size
- Mobile font size
- Line Height
- Letter spacing
- Text Transform
Navigation submenu settings
- Background color – change this to set a background color for the submenu items
- Hover Color – change this to set a color for the hovered state of the submenu items
- Item Text Color – change this to set the text color for the submenu items
- Item Typography – click this to open the typography panel from where you can change the submenu items text:
- Font Family
- Font Variant (weight)
- Font Size
- Mobile font size
- Line Height
- Letter Spacing
- Text Transform
Text logo typography
- Text logo color – change this to set a color for the text logo
- Sticky nav text logo color – change this to set a color for the text logo when in scrolled state
- Text logo typography – click this to open the typography panel from where you can change the logo:
- Font Family
- Font Variant
- Font Size
- Mobile font size
- Line Height
- Letter Spacing
To replace the text logo with an image logo, you have to go to General Settings > Site Identity and set an image for the logo.