Overview
Generator includes built-in scroll-to functionality that allows header navigation items to smoothly scroll users to specific sections on a page — ideal for landing pages. This works with two headers: the Global Standard Header (not the Mega Menu) and the Landing Page Header (local module).
Step 1: Access Your Navigation Menus
Go to HubSpot Settings by clicking the gear icon in the top right. In the left sidebar, scroll down to Content, then click Navigation Menus. Create a new menu or open an existing one.
Step 2: Add a Scroll-to Menu Item
When adding a menu item, instead of selecting a standard page link, choose the URL Link option under Actions. In the URL field, enter the scroll target using this format:
#section-[number]
The number corresponds to the section's position from the top of the page. To find it, simply count sections from the top — the first section is 1, the second is 2, and so on.
Example: To scroll to the 5th section on the page, enter #section-5.
Step 3: Scroll to a Section on a Different Page (Optional)
You can also direct users to a section on a different page. Instead of the URL Link option, choose Page Link with URL Parameter. Select the destination page, then append the same #section-[number] format to target the correct section on that page.
When a user clicks the nav item, they'll be redirected to the selected page and automatically scrolled to the specified section.
Once the menu item is saved with the correct format, Generator's theme handles the smooth scroll behavior automatically. No additional configuration is needed.