Getting Started
Projects
Apps
Branding
Mind
Domains
Settings
Visual Builder
Integrations
Guides
Website Headers
Your website's header is the navigation bar that appears at the top of every page. It is the first thing visitors see, and it stays with them as they move through your site. A well-designed header grounds your audience by providing your logo, intuitive navigation links, and a clear call-to-action.
What you'll find here
Your website's header is the first thing visitors see, guiding them as they move through your site. The Headers screen gives you a centralized place to create and manage multiple standalone navigation bars for different purposes—whether you need a comprehensive menu for your marketing pages, a streamlined version for landing pages, or a unique layout for your blog. By designing your headers once, you can easily attach them to your templates and reuse them across your entire site, keeping your branding and navigation perfectly in sync.
The headers list
Navigate to Website > Headers to access your complete library of website headers. This dashboard displays all your existing headers in an organized table, showing the Name and Header preview columns. From this central hub, you can use the search field to find a specific design, or use the quick actions to edit or delete headers you no longer need.
Centralized Header Management
Access all your website headers from a single dashboard. Easily search through your existing layouts, edit navigation elements, or create a new header to ensure a consistent, branded experience across your entire site.
The Header Editor Toolbar
Toolbar Overview
The top toolbar gives you immediate access to essential editing, previewing, and configuration tools while building your header. Switch between locales to manage multi-language content or preview your changes instantly.
Building Your Header
Just like standard website pages, headers are constructed using a flexible system of sections and columns. However, they typically rely on a specialized set of blocks optimized for global navigation—most notably the Main Menu block, which keeps your visitors oriented no matter where they land.
Build Your Perfect Header
Design a navigation bar that guides your visitors effortlessly. Upload your logo, organize your menu items, and configure a standout call-to-action button that automatically pulls from your branding settings. Attach your header to a website template to instantly update every page on your site.
Connecting Headers to Pages
Headers don't exist in isolation—they must be attached to your pages before visitors can actually see them. There are two ways to apply a header to your site:
Through a Template
Headers don't exist in isolation—they need to be attached to pages so visitors actually see them. The most efficient approach is assigning your header directly to a website template. Because templates define the shared structure for a group of pages, any page using that template automatically inherits the selected header. This is the easiest way to maintain consistent navigation across your site without manually updating individual pages.
Direct Assignment on a Page
Need to break away from a template? You can assign a header directly to any individual page. While editing a page, open your settings and navigate to the Design tab. Use the Header dropdown to select your preferred navigation bar. This gives you the flexibility to override a template's default header or attach a unique menu to a standalone landing page.
AI-Generated Headers
If you use Giant Context's AI to generate content, your website headers can be built automatically. These AI-crafted headers arrive in your workspace as drafts, clearly marked with an info bar at the top of the editor indicating their generated status. You retain full control—review the suggested layout, tweak the navigation links, and approve the final design exactly as you would with manually created content.
Settings dialog
Best Practices & Troubleshooting
Common Questions
Test hamburger menus in the mobile preview, ensure the logo isn't too large, and check that the CTA button is easy to tap.
Overlay headers sit on top of page content. Choose text colors carefully so they remain readable against the underlying hero sections.