If your site navigation feels cluttered or disconnected, it becomes harder for visitors to navigate your pages and for marketing teams to maintain structure as the site grows.
As new sections are added, branding evolves, or conversion paths are refined, menu management in HubSpot becomes a recurring point of friction.
The simple menu module is one of the most efficient tools in HubSpot CMS for handling navigation updates without code. Still, many users struggle with where to make edits, how menus connect across templates, and why a single change can affect multiple pages.
This guide explains how the simple menu module works, where it fits within HubSpot CMS, and how to edit it safely.
You will also see practical examples across headers, footers, and landing pages, along with metrics you can use to confirm your updates are performing as expected.
Using the Simple Menu Module to Control Navigation in HubSpot
The simple menu module provides a structured way to display navigation links on HubSpot pages.
It pulls from menus created under:
Settings > Website > Navigation
When the module is added to a page or template, it references a named menu and renders all associated menu items. Layout options allow the menu to display horizontally or vertically, and CSS classes can be applied for styling control.
Inside Design Manager, the simple menu module appears alongside other local and global modules.
Global vs Local Use:
- Global modules apply changes across every template where they appear
- Local modules affect only the page or template on which they are placed
This setup allows marketers to make navigation updates while designers maintain layout consistency within HubSpot’s backend.
For teams that require deeper customization, HubSpot supports code-level changes. However, for most navigation needs, the simple menu module provides sufficient control without development work.
How It Works Under the Hood
The simple menu module connects backend navigation settings to how visitors navigate live pages.
Behind-the-Scenes Components
Menu Source:
The module references a menu created under Settings > Website > Navigation.
Menu Depth:
Controls how many submenu levels appear, from top-level items only to deeper hierarchies.
Orientation:
Horizontal layouts work well for headers. Vertical layouts suit sidebars and resource sections.
Custom Styling:
CSS classes can be applied to adjust spacing, hover states, and typography.
Responsiveness:
The module inherits styling rules from the active theme and can be refined within templates.
When a page loads, HubSpot reads the selected menu and generates HTML dynamically. Any menu update in navigation settings is applied instantly across all modules that reference that menu.
If the module is global, updates apply everywhere. If it is local, changes affect only that instance. Always confirm module type before editing on a live site.
Main Uses Inside HubSpot
Header Navigation for Website Templates
The most common use is a global header menu.
This allows teams to edit one menu and maintain consistent navigation across the entire site without modifying templates.
Example:
A “Resources” dropdown is added with links to Ebooks and Webinars. Once updated in navigation settings, the new items appear across all pages using the global header.
Secondary Menus for Landing Pages
Landing pages often require limited navigation to keep visitors focused.
Example:
A local simple menu includes only Home and Contact links. This keeps navigation minimal while still offering essential paths.
Footer Menus for Compliance and Reference Links
Footers typically contain legal and policy links.
Example:
A “Footer Links” menu includes Privacy Policy and Accessibility pages. When assigned to a global footer module, updates apply sitewide without republishing pages.
Sidebar Menus for Blogs or Resource Centers
Vertical menus help users browse content categories efficiently.
Example:
A resource section uses a vertical menu with Tutorials, Case Studies, and Guides. Limiting depth to a single level keeps scanning simple as the content grows.
Common Setup Errors and Wrong Assumptions
Editing Directly in the Page Editor:
Menus cannot be edited inside page content.
Fix:
Manage menu items under Settings > Website > Navigation.
Not Distinguishing Global From Local Modules:
Editing a global module affects every template it touches.
Fix:
Check the module type in Design Manager. Duplicate and convert to local when isolated changes are required.
Expecting Styling Changes to Apply Immediately:
CSS changes may not appear if class names are incorrect.
Fix:
Confirm theme CSS references and class name consistency.
Missing Submenus Due to Depth Settings:
Nested items may not appear if depth is limited.
Fix:
Increase Maximum Depth in module settings to match menu hierarchy.
Step-by-Step Setup or Use Guide
Before making changes, confirm CMS editing permissions and access to templates.
- Go to Design Manager
Navigate to Marketing > Files and Templates > Design Tools. - Open the Right Template
Locate the theme or template containing the header, footer, or sidebar. - Find or Insert the Simple Menu Module
Select the existing module or drag it into the template from the module list. - Set the Menu Source
Choose the appropriate menu from the Menu dropdown. - Adjust Menu Depth and Orientation
Select the number of submenu levels and choose horizontal or vertical layout. - Apply Optional CSS Classes or IDs
Enter standard class names provided by your design team. - Save and Publish the Template
Publish changes and verify impact across linked templates if the module is global. - Test Your Updates
Preview live pages, check responsiveness, and validate spacing and link behavior.
Updating Menu Content Only
If the layout does not need changes:
- Go to Settings > Website > Navigation
- Select the relevant menu
- Add or reorder menu items
- Save and publish for immediate updates across all linked modules
Measuring Results in HubSpot
Once the menu is live, measure performance using HubSpot analytics tools.
Metrics to Track
Page Views and Exit Rates:
Check whether visitors move deeper into the site.
Click Tracking:
Track menu link interactions using event tracking or analytics integrations.
Heatmaps and Live Sessions:
Review user behavior through tools like Hotjar.
URL-Specific Reports:
Measure traffic changes to pages added to navigation.
Conversions From Menu Links:
Track signups, downloads, or form submissions tied to menu paths.
Enterprise accounts can also use behavior event dashboards to analyze full navigation journeys.
Short Example That Ties It Together
A marketing team wants to increase visibility for product resources.
Initial Setup:
The main navigation includes Home, Solutions, Pricing, Blog, and Contact.
Action Taken:
A Resources menu is added with Guides, Case Studies, and Infographics as child links.
Template Check:
The header uses a global simple menu linked to the main navigation.
Result:
The new menu appears across the site immediately.
Impact Measured:
Analytics show a 20% increase in traffic to Case Studies after 1 week.
How INSIDEA Helps
Navigation management should stay structured as sites scale.
INSIDEA supports teams by building HubSpot CMS environments where menus, templates, and layouts are easy to update without risk of error.
Our HubSpot Consulting Services Include:
- HubSpot Onboarding: Portal setup with clear navigation structure
- Ongoing CMS Management: Safe updates without theme disruption
- Workflow and Automation Support: Navigation aligned with CRM activity
- Reporting Setup: Navigation impact tied to page and conversion data
- Theme Customization: Consistent branding across headers, footers, and menus
Teams often hire HubSpot experts at INSIDEA to manage navigation changes while keeping the CMS structure stable.
When menus are structured properly, updates take minutes instead of hours, and visitors always know where to go next.
