Eyebrow Navigation — Traverse | HubSpot Theme Docs

Content

Add contact links (email and phone)
Add language switcher
Add announcement (with styled link)

Styles

Set Dark Mode

Usage Guide

The Eyebrow Navigation module serves as a secondary navigation layer that sits above your main header, providing visitors with quick access to essential contact information and site utilities without cluttering your primary navigation. This module is particularly effective on business websites, e-commerce stores, and multi-language sites where you need to surface important details immediately upon page load.

You can add this module to any page template in the HubSpot page editor by dragging it from the module library to the top of your page layout. Position it above your main header module for the intended visual hierarchy. The module works exceptionally well on homepage templates, landing pages, and website pages where you want to establish credibility through visible contact options.

The announcement feature is ideal for promoting time-sensitive offers, important updates, or calls-to-action that need site-wide visibility. Unlike banner modules that can feel intrusive, the eyebrow navigation integrates these messages naturally into your site’s structure. Consider using this space for limited-time promotions, shipping notifications, or event announcements.

For international businesses, the language switcher functionality eliminates the need for a separate language selection module elsewhere on your pages. This placement follows web convention by positioning language options in the uppermost navigation area where multilingual users expect to find them.

The dark mode option ensures the module adapts to different design aesthetics within the Traverse theme. Use dark mode when placing the module over light-colored headers or when you want to create visual contrast with your main navigation styling. This flexibility allows the eyebrow navigation to complement rather than compete with your primary header design.