Header Setup

The header is the first thing visitors see. Dirigible separates the WordPress menu (your links) from theme options (layout, logos, colors, and mobile behavior).

Overview: Flexible Headers and Mobile Menus.

Create and assign menus

1. Go to Appearance → Menus.
2. Create a menu or edit an existing one.
3. Add pages, custom links, and categories.
4. Assign the menu to the Primary (header) location.
5. Click Save Menu.

Repeat if you use a separate footer menu — footer assignment is under Footer & Contact (Footer and Contact).

Mega menus: If Dirigible Mega Menu is active, link a menu item to a Mega Menu post for dropdown panels with blocks.

Upload logos

1. Open Appearance → Customize → Header & Menus → Logo.
2. Upload a Header logo for the default bar.
3. Add a Reverse logo when the menu sits on dark or photographic heroes.
4. Optionally set Scroll logo and Mobile logo when those states need different artwork.

Control reference: Logo.

SVG logos stay sharp at every size. PNG works when SVG is not available.

Configure desktop navigation

Open Desktop:

1. Set Transparent Masthead to Enabled when the first block on the page is a hero or full-width image — the menu floats over the photo instead of a solid bar.
2. Turn on Sticky Menu to keep links visible while scrolling.
3. Try Floating Masthead for a rounded, blurred bar with opacity controls.
4. Set Link Color and hover states for readable contrast on your header background.

Preview on the home page and an interior page — transparent headers behave differently when there is no hero at the top.

Configure mobile navigation

Open Mobile:

1. Set the Breakpoint where the hamburger replaces the desktop bar.
2. Choose drawer Width and Background.
3. Style Link Color and icon sizes for the open and close buttons.
4. Use the Customizer device preview to confirm tap targets feel comfortable.

Add utility links and a header button

Utility Nav — phone numbers, login links, or secondary items beside the main tree:

• Utility Nav (header placement)
• Style utility links globally under Styles → Utility Nav

Header button — a single call-to-action (Donate, Book Now, Contact):

• Button — label, URL, and visibility

Accent border

Optional decorative line under the masthead: Accent Border. Match the color to your palette primary or accent swatch.

Quick checklist

Click Publish in the Customizer when finished.

Related guides

• Palette and Typography — nav and button colors
• Widths and Layout
• Footer and Contact
• Getting Started