Sign in Register

Site Header

Site Header Customizer Options Guide

This guide covers the site header options available in the WordPress Customizer.

Go to Appearance > Customize > Header & Navigation.

Site Identity

Use Site Identity to manage the site name, tagline, and site icon.

The header displays the custom logo when one is set. If no custom logo is set, the header displays the site title and tagline.

Logo Settings

Go to Header & Navigation > Logo Settings.

Use Logo Maximum Width (px) to control the maximum display width of the header logo.

The available range is:

  • Minimum: 50px
  • Maximum: 600px
  • Step: 10px

After changing the logo width, click Publish.

Site Header

Go to Header & Navigation > Site Header.

Navigation Style

Use Navigation Style to choose how the main navigation is displayed.

Available options:

  • Horizontal Navigation — displays the Primary Menu in the site header.
  • Hamburger Menu — displays the menu through a hamburger button and slide-out menu panel.
  • Community Menu (Left Rail) — displays the Community Menu as a persistent left rail on desktop.

When Community Menu (Left Rail) is selected, the mobile/tablet hamburger menu uses the Community Menu.

Sticky Header

Enable Sticky Header to keep the site header fixed at the top of the page while scrolling.

Disable it if you want the header to scroll normally with the page.

Hide Header on Authentication Pages

Enable Hide Header on Authentication Pages to remove the header from login, register, lost password, and reset password pages.

This creates a more focused authentication page layout.

Hide Footer on Authentication Pages

Enable Hide Footer on Authentication Pages to remove the footer from login, register, lost password, and reset password pages.

Although this setting is located in the Site Header section, it controls the footer display on authentication pages.

Header Icons

The Site Header section includes controls for which header items appear.

Show Centered Search Bar

Enable Show Centered Search Bar to display the centered search bar in the header.

When the centered search bar is enabled, the header uses the center area for search.

Group Search Results by Content Type

Enable Group Search Results by Content Type to show search results grouped by content type.

Disable it to show search results as one unified list without category headings or filter tabs.

Show Cart Icon

Enable Show Cart Icon to display the WooCommerce cart icon in the header.

The cart icon is intended for sites using WooCommerce.

Show Messages Icon

Enable Show Messages Icon to display the messages icon for logged-in users.

Logged-out visitors do not see the messages icon.

Show Notifications Icon

Enable Show Notifications Icon to display the notifications bell for logged-in users.

Logged-out visitors do not see the notifications icon.

Show User Menu

Enable Show User Menu to display the user avatar dropdown menu for logged-in users or the sign-in option for logged-out visitors.

Show Sign In Button

Enable Show Sign In Button to display a sign-in button in the header for logged-out visitors.

Show Register Button

Enable Show Register Button to display a register button in the header for logged-out visitors.

The register button also depends on whether user registration is enabled in WordPress.

Icon Order

Use Icon Order to control the order of supported header icons.

The supported values are:

search,cart,messages,notifications,user

Enter the values as a comma-separated list.

Example:

cart,messages,notifications,user,search

The centered search bar uses the header center area, so the search value does not place a separate search icon in the right-side icon group.

Header Menu Typography

The Site Header section includes typography controls for the header navigation menu.

Font Family

Use Font Family to choose a font for header menu items.

Leave this set to Inherit (Body) if you want the header menu to use the same font as the body text.

Font Size

Use Font Size (px) to adjust the size of header menu text.

The available range is:

  • Minimum: 12px
  • Maximum: 24px
  • Step: 1px

Font Weight

Use Font Weight to control how bold the header menu text appears.

Available options:

  • 400 (Normal)
  • 500 (Medium)
  • 600 (Semi-Bold)
  • 700 (Bold)

Text Transform

Use Text Transform to control capitalization for header menu items.

Available options:

  • None
  • Uppercase
  • Capitalize

Letter Spacing

Use Letter Spacing (px) to adjust spacing between letters in the header menu text.

The available range is:

  • Minimum: -2px
  • Maximum: 5px
  • Step: 0.1px

Header Colors

Some header colors are located under Appearance > Customize > Global Design > Colors.

Header-related color options include:

  • Site Header Background — controls the navigation header background color.
  • Navigation Link Color — controls the main navigation menu link color.
  • Hamburger Menu Background — controls the hamburger menu panel background.
  • Hamburger Menu Text — controls hamburger menu item text.
  • Hamburger Menu Hover BG — controls hamburger menu hover background.
  • Hamburger Menu Active — controls the active hamburger menu item color.
  • Hamburger Menu Icon — controls the hamburger icon color.

Use these options when you want to style the header without changing the header structure.

Community Menu Settings

If you choose Community Menu (Left Rail) under Site Header > Navigation Style, use the Community Menu sections under Header & Navigation to control the left rail.

Related sections include:

  • Community Menu – Behavior
  • Community Menu – Layout
  • Community Menu – Colors
  • Community Menu – Typography

These settings control the Community Menu display rules, width, spacing, colors, and typography.

Test the Header

After saving changes:

  1. View the site while logged out.
  2. View the site while logged in.
  3. Test the header on desktop.
  4. Test the header on tablet or mobile width.
  5. Confirm the correct menu appears for the selected navigation style.
  6. Confirm the search bar, cart, messages, notifications, and user menu appear only where expected.

Troubleshooting

The register button does not appear

Confirm user registration is enabled in WordPress.

The cart icon does not appear

Confirm WooCommerce is active and Show Cart Icon is enabled.

The messages or notifications icons do not appear

Confirm you are viewing the site while logged in. These icons are for logged-in users.

The Community Menu does not appear as expected

Confirm Navigation Style is set to Community Menu (Left Rail) under Header & Navigation > Site Header.

Then check the Community Menu behavior settings under Header & Navigation > Community Menu – Behavior.

Header changes do not show on login or register pages

Check whether Hide Header on Authentication Pages is enabled. If enabled, the header is intentionally hidden on authentication pages.