The inner pages navigation can be customized so as to differ from navigation in the front-page.
Thus, there’s a specific section dedicated to Inner Pages Navigation.
Go to the Customizer -> Navigation -> Inner Page Navigation.
It is important that you have an inner page open, when customizing navigation for the inner pages. Otherwise, the changes you apply here will not be visible.
Inner Pages Navigation Options
The options for configuring navigation within inner pages are:
Use front page navigation style
This option is for replicating the navigation style of the front-page, to the inner pages of the website. It will take the configurations from the front-page navigation style and apply them to the inner pages.
If this option is enabled, there will be no additional features for customization of the inner pages navigation.
Stick to top
When enabled, this option makes the navigation bar stick to top when visitors scroll down an inner 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
This allows you to insert a line delimiting the navigation bar from the rest of the inner page. This will be the navigation bottom border. Depending on the settings you apply to it, the bottom border will be more visible or subtler, but perfectly integrated into the overall design.
Transparent navigation bar
If you enable this option, the navigation bar will have no distinctive color from the header. This way, there’ll be a very cohesive integration of the navigation bar in the webpage.
Navigation bar type
6 types are available for the inner pages navigation bar:
- Logo on left, navigation on right
- Logo above menu
- Logo inside navigation (the logo symbol will be part of the items comprised by the navigation menu)
- Logo, navigation, custom area (you can add a customized button in the custom area)
- Navigation, logo, custom area (you can add a customized button in the custom area)
- Logo, custom area, navigation below
Navigation Style
6 styles are available for the inner pages navigation:
- Simple text menu – the menu in the navigation bar will have no additional customization; it will be displayed in plain text
- Underlined active item – the active item in the menu will be underlined
- Active item with top line – the active item in the menu will have a line above it
- Active item with top and bottom line – the active item in the menu will be marked by a line above it and a line below the respective item
- Active item as round button – the active item will be marked by a round button
- Active item as round bordered button
Navigation Menu Settings
Normal Menu Settings
These settings (available when you click on Normal Menu Settings) apply to the menu in normal state. They refer to:
Items align – the items in the menu can be aligned to the left, at the center or to the right.
Navigation bar color – this is the color of the navigation bar, in normal state
Items color – choose the appropriate color for the menu items, in normal state
Highlight color – for highlighting the active item, you might choose a different, salient color for that respective item.
Highlighted item text color – to better emphasize the active item, you might want to choose a certain text color for that item.
Hovered item text color – this is the color for each button text in the menu, when hovering over with the mouse.
Sticky Menu Settings
These features are specific to the menu when users scroll down the page and the inner pages menu sticks to top.
Click on Sticky Menu Settings and a panel will open with the customization options:
Items Align – the menu items can be aligned horizontally to the left, at the center or to the right
Navigation Bar Color – this is the color you define for the navigation bar, when in scrolling mode
Items Color – this is the color of each item of the menu, when in scrolling mode
Highlight Color – to preserve the active item highlighted in scrolling mode, you can define a certain color for it when the navigation bar is set to sticky
Highlighted Item Text Color – the active item can be better highlighted in the menu, when this is set to sticky, by attaching a different color to that item text
Hovered Item Text Color – this is the color of the text in menu items, when hovering over with the mouse, while visitors scroll down the page.
Navigation Typography
You can easily customize the typography of the items placed in the navigation bar. Click on Navigation Typography and you will open the panel with customization options:
Font Family – select a font family for the text of the menu items
Variant – select a variant for the font family you’ve already chosen for the text of the menu items
Font Size – set the dimensions of the font for the text of the items in the inner pages menu
Line Height – this refers to the vertical distance the text of the menu items occupies in the navigation bar
Letter Spacing – this refers to the spacing between the letters of the text contained in the menu items
Text Transform – from here, you can turn text into uppercase, lowercase, or capitalize it, etc.
