Configure Inner Pages Navigation Style

Article sections

    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.

    Related Articles