How to Create a Custom Header for Landing Pages in HubSpot
Landing pages have one job: convert. That means every element on the page — including the header — should be working toward that goal. The standard site header, with its full navigation menu and multiple links, gives visitors too many ways to wander off before they take action. A dedicated landing page header fixes that by stripping things back to just a logo and a call to action, keeping visitors focused on exactly what you want them to do.
Here's how to set one up in HubSpot using the Generator theme.
Why landing page headers are different
Most HubSpot sites use a global header — one header that appears on every page automatically. That's great for consistency across your main site, but it works against you on a landing page. Every link in that navigation is an exit ramp. Best practice for landing page design is to remove the menu entirely and leave only your logo and a single CTA button. Some marketers even remove the logo link so there's truly no way out except converting or closing the tab.
Adding a local header in Generator
Generator includes a Local Header module built specifically for this situation. Unlike the global header, the Local Header lives on a single page and can be configured independently without touching the rest of your site.
To add it, open the page editor and click the plus button to browse Generator's modules. Search for Header Local and drag it onto the page. HubSpot will place it inside a new section — before you do anything else, click into that section, go to Alignment and Spacing, and remove the top and bottom padding. That gets it sitting flush like a proper header.
Hiding the navigation
Once the module is on the page, click into it and go to the Menu settings. You'll notice that HubSpot doesn't give you a way to simply deselect a menu once one has been chosen. Generator solves this with a Show/Hide Navigation toggle — just switch it off and the menu disappears, leaving you with a clean logo and CTA layout.
Hiding the global header
Here's the step people miss. Adding a Local Header doesn't automatically remove the global header — you'll have both stacked on the page until you tell Generator to hide the global one. Inside the Local Header module, go to the Visibility section and check the option to hide the global header. You won't see it disappear immediately in the editor — HubSpot renders it that way — but reload the page or switch to preview and it'll be gone.
If you ever need the global header back, just return to that same setting and uncheck it. Nothing is deleted, it's simply hidden.
Other things you can do with the Local Header
Beyond landing pages, the Local Header is useful any time you need a page to feel separate from the rest of your site — microsites, event pages, campaign-specific experiences. You can also set the header to fixed or sticky positioning, and control the responsive breakpoint at which it adapts for mobile, giving you fine-grained control over how it behaves across devices.