Mega Menu

The theme includes a Mega Menu feature, allowing you to create advanced, visually rich dropdown menus for your website’s navigation. Each mega menu like a separate page, and you can add almost any module. Follow the steps below to set up and customize your mega menu.

Before You Start

Before creating a mega menu, you first need to set up your main navigation menu.

HubSpot Knowledge Base: Set up site navigation menus

After the menu is created, you need to assign it to the header. If you have only one menu, it will be selected automatically.

  1. Open any page that uses the theme in the page editor. Click on header to open the Global Content Editor.
  2. In the left sidebar, click the Contents icon .
  3. Select Navigation.
  4. Choose the menu you created from the dropdown list.
  5. Click button Publish to assets to save settings.
Pitch Theme Documentation: Global Header

Mega Menu Settings

  1. In your HubSpot account, navigate to Content → Website Pages or Content → Landing Pages.
  2. Open any page that uses the theme in the page editor.
  3. In the content editor, click the Edit menu and select Theme: Pitch in the editor toolbar.
  4. Go to the Mega Menu section.
HubSpot Knowledge Base: Edit theme settings

Creating and Configuring a Mega Menu

Click Add One to create a new mega menu. Enter the menu item number in your main navigation to which this mega menu should be attached. The mega menu will appear when the user hovers over this item.

Important: Each mega menu must be attached to a unique navigation item number. Duplicate numbers are not allowed.

Optional: If you want to create a menu without displaying it live on the website (for example, while editing), assign it a high menu number, such as 99. This keeps the menu hidden from visitors.

After creating and styling the mega menu, click Publish Theme.

Options

Top and Bottom Border Radius: Set the top and bottom corner rounding.

Square top corners when header is sticky: If your website uses a sticky header, you can disable rounding of the top corners when the header becomes fixed.

Width: Choose between Compact or Expanded.

Compact: The menu has left and right padding, so it does not span the full width of the browser window.

Expanded: The menu spans the entire width of the browser window, from edge to edge.

This allows you to choose the style that best fits your website design and layout needs.

Adding Content to the Mega Menu

Each mega menu functions like a separate page, and you can add almost any module. You are not limited to links — you can create complex layouts, images, buttons, cards or other modules to produce a visually striking “wow” effect.

  1. Open any page that uses the theme in the page editor. Click on header to open the Global Content Editor.
  2. You will see drag-and-drop areas for each mega menu. Each area is labeled with:
    • The mega menu number.
    • The navigation item number it is attached to.
  3. Click button Publish to assets to save Mega Menus.

Creating Link Groups in the Mega Menu

To create a structured group of links in the mega menu, we recommend using the Menu module.

  1. Add the Menu module to a drag-and-drop area inside your mega menu.
  2. In the module settings, set Menu Type to Custom.
  3. Click Apply Changes.

Once applied, you will be able to configure your links directly within the module.

For each menu item, you can add: a link, a short description, a label tag (for highlighting items such as New, Popular, etc.)

Open the Styles tab to customize the appearance of the menu. Here you can adjust settings such as: Layout direction (Row or Column), font sizes, link colors, description colors, margins and etc. These options allow you to easily match the menu to your website’s design.

You are not limited to the Menu module. Since mega menus support drag-and-drop areas, you can also use other modules to create more engaging layouts, such as: Button, Promo Box, Animated Card, Hover Box and others. Feel free to experiment and combine different modules to create unique and visually impressive mega menu layouts.