How to set up your site's navigation menus

Last updated: May 31, 2018

Available For:

Marketing: Basic, Pro, Enterprise
Sales: N/A
Service: N/A
Add-Ons: Website

When you first start building your site pages with HubSpot, there are several important questions that you may ask yourself:

  • What website pages will you include as part of your website?
  • What website pages belong in your primary navigation menu?
  • Will you have multiple navigation menus?
  • How will you order the pages in your navigation?
  • What pages do you think will be most important to your visitors?

These questions will help you begin to plan and to build your site's information architecture (the structural organization of your content). Once you have a good idea about how your site will be organized, you will want to begin building your menus. The advanced menus feature in HubSpot lets you easily map out the entire information architecture and use website pages in the form of a navigation menu. In this section, you will learn to:

Why should you plan the information architecture of your website?

Information architecture is a series of diagrams or maps that organize and prioritize all of the content that you plan to have on your site. They can eliminate a lot of guesswork when you are building out new pages and help your website content keep its core focus. An organized information architecture will also make it easier for visitors to navigate and find content on your website.

When planning your site's information architecture, you want to determine:

  • What are the most important pages that you want your visitors to always be able to access while navigating your site ("top level" pages)?
  • Do these "top level" pages have child pages that you would like to include on the navigation as well?
  • Do these child pages contain another level of pages?
HubSpot Help article screenshot

Once you have an idea of how your site is structured, you can convert that plan into your navigation menus in HubSpot using the advanced menu maps tool. This tool allows you to structure any number of different navigation menus. Site pages (non-landing pages) and thank you pages should always include a primary navigation menu.

HubSpot Help article screenshot

You may want to create a secondary menu that contains more links to less prominent pages on your site.

HubSpot Help article screenshot

How to create primary and secondary navigation menus

Follow the steps below to convert your information architecture into a primary navigation menu. These menus can then be selected in an advanced menu module in your templates in the design manager.

1. Navigate to Content Settings

In your HubSpot account, click the settings icon settings in the main navigation bar.

On the left-hand sidebar, select MarketingWeb pages. Then click the Advanced Menu tab.

 

2. Choose a menu

Your default menu contains the pages that will automatically populate the default content of an advanced menu module. You can select an existing menu to update, or click + Add menu to create a new menu.

If you'd like to create a new menu from an existing advanced menu, click ActionsClone in the upper-right corner.

HubSpot Help article screenshot

3. Add new pages to the menu

Hover your mouse above or below an existing menu, then click the + sign and select a new item to add to the navigation:

  • Add item without link: adds another item to your menu that doesn't link to an existing page. This is often used as a placeholder for child menu items.
  • Add page link: adds a menu item that links to a specific HubSpot page.
  • Add Page link with URL parameters: adds a menu item that links to a specific HubSpot page. With this option, you can type to enter the exact URL of the page you want.
  • Add URL link: adds a menu item that links to a specific URL.
HubSpot Help article screenshot

You can also add a menu item by hovering over the right side of an existing item and clicking Actions > Add item below

HubSpot Help article screenshot

Give your new menu item a name in the Menu item label, and indicate a specific HubSpot page or URL if you want this item to be linked.

If you would like this link open in a new window, hover over the right side of the menu item and click Actions, then click the Open link in new window checkbox.

HubSpot Help article screenshot

4. Add child pages to a menu item

To add a new child page to the menu, hover over the right side of the menu item where you want this child item to live. Click ActionsAdd child item below and enter the Menu item label and Select a page for the link. If you need to enter a URL manually, click Actions and select URL Link to change the child menu item type.

For an example of a child page menu, see the 'Company Blogs' menu item appear as the parent with 3 child pages underneath it in the dropdown.

 

Child pages typically appear in a dropdown menu or fly out submenu, although you can write CSS to style your menu's HTML markup to suit your needs.

HubSpot Help article screenshot

5. Save and publish your menu

To finalize the changes you've made and push these changes live to all pages that are using this menu, click Publish in the upper-right corner.

In the inspector, click + Add and locate the Menu module to drag into your template layout in the editor. 

8. Creating a secondary site map and navigation menu

As previously mentioned, you can create multiple site maps for different menus. Within the advanced menus tool, click the Add menu buttonName your menu, then click Create menu.

HubSpot Help article screenshot

How to set up your sitemap

Follow the steps below to convert your information architecture into a sitemap.

1. Navigate to Content Settings

In your HubSpot Marketing account, navigate to Content > Content Settings.

HubSpot Help article screenshot

Select the Sitemaps tab.

2. Choose your domain

Under Pages to include in your sitemap, select the domain corresponding to the sitemap you would like to edit using the dropdown.

3. Select the pages to include in your sitemap

To add a new page to your sitemap, click + Add a page. In the dialog box that appears, use the dropdown to select an existing page published on this domain, then click Add.

 

To exclude an existing page from your sitemap.xml file, hover over a specific page and click RemoveAfter you finish making changes to your sitemap, be sure to click Save take your changes live. 

4. View your sitemap

You can take a look at your sitemap by selecting your domain in the dropdown menu, then clicking View XML file. This will provide you with a direct link to your sitemap, which will be what you need for submitting your sitemap to Google Analytics and similar services.

HubSpot Help article screenshot

Was this article helpful?

Previous article:

Measuring Your Performance Project

Next article: