Skip to content

How to Create Page-Level Headers for your HubSpot Site Using Generator

Why Use a Local Header?

Generator's global header appears on every page of your site. But for landing pages and microsites, you often need a stripped-down header — one without navigation links that could pull visitors away from your conversion goal. The Local Header module lets you create a page-specific header while hiding the global one.

Adding the Local Header Module

  1. Click the + button to open Generator's module library.
  2. Search for Header Local.
  3. Drag the module onto the page, placing it just below the global header. HubSpot will automatically wrap it in a new section.

Removing Section Padding

Once placed, the module sits inside a section with default padding that pushes it away from the top of the page.

  1. Click into the section containing the local header.
  2. Go to Alignment and Spacing.
  3. Remove the top and bottom padding. The module will immediately start behaving like a proper header.

Styling the Local Header

Click the Local Header module to open its settings. From here you can style it just like the global header — including changing button styles (e.g., Secondary or Primary/Highlight) to match your page's design.

Hiding the Navigation Menu

For landing pages, you'll typically want to remove the navigation menu entirely.

  1. In the module settings, go to Menu.
  2. Select or confirm your menu source as needed.
  3. Toggle Show/Hide Navigation to hide the nav. This works around HubSpot's native limitation, which doesn't allow you to fully deselect a menu once chosen.

Hiding the Global Header

With the local header in place, the global header still appears above it. To remove it:

  1. Click the Local Header module.
  2. Go to Settings → Visibility.
  3. Enable Hide Global Header.

Note: Due to how HubSpot renders the editor, the global header may appear to still be present. Reload the page (or use Preview) to confirm it's hidden.

Restoring the Global Header

The global header is never deleted — it's only hidden. To bring it back:

  1. Click the Local Header module.
  2. Go to Settings → Visibility.
  3. Uncheck Hide Global Header.
  4. Reload the page or use Preview to confirm it's visible again.

This lesson covered how to use Generator's Local Header module to create a page-specific header and suppress the site-wide global header — ideal for landing pages and microsites where navigation should be minimized. The key actions were adding the module, removing section padding, toggling navigation visibility, and hiding the global header via the module's Visibility settings. The next lesson will likely continue exploring Generator's page-level overrides or other specialized modules.