Mega Menu Navigation

Definition

A Mega Menu is an expanded, desktop-only navigation layout used on larger Hibu One Smart Sites with multiple Tier 1 pages. It organizes Category Landing Pages (CATs) and their children into a clean, multi-column structure.

Beginning December 3, 2025, all new sites using the content tool automatically include the updated Mega Menu widget (labeled as MEGA NAV 2), which pulls pages dynamically from the site structure and simplifies setup.

New Mega Menu - After December 3, 2025

When to Use

Use the updated Mega Menu only when:
• The site includes three or more Category Landing Pages (CATs)
• Each CAT has two or more child core service pages
• The site may also include standalone Tier 1 core page(s) not tied to any CAT

Do not use a Mega Menu when:
• Only one CAT exists
• Standard dropdown navigation sufficiently handles the tiers
• Any page (including Home) would have only a single child page

Key Behaviors

The widget automatically displays eligible pages in grid format
Supports up to five columns
Columns may be reduced if fewer are needed for balance
Interior pages automatically reposition if their parent page is moved during build

Structure & Content Rules

CATs and subpages should be ordered alphabetically when possible but may be rearranged for visual balance.
A total of 11 CATs + standalone core pages is the maximum allowed.
If the number of pages exceeds this limit, the writer or designer must consolidate or reorganize content.
Mega Menus are desktop-only; they revert to standard dropdowns on mobile.

Styling Rules

Colors are defined by theme:
Theme Color 10 – Navigation BG
Theme Color 11 – Navigation Text
Hover states are fixed and cannot be altered.
Gradient or image backgrounds are not permitted.
No additional widgets (e.g., forms, coupons, callouts) may be placed inside the Mega Menu.
Rollover behavior mirrors the sub-navigation hover state (white background / Navigation BG text).

Editing & Management

To edit navigation links or Mega Menu items, open the Navigation Links widget and select Manage Links.
To open a Mega Menu section, hover over the Navigation widget and click the section or link when the Mega Menu appears.
Deleting a navigation link or switching header presets will delete its associated Mega Menu section.

< Older Post

Newer Post >

Mega Menu Navigation