Page Navigation

A sticky bar with links intended for in-page navigation.

Note: This whole section will stick to the top of the page as the user scrolls down.

View a live demo of this section.

Modules

page-navigation


How to Use This Section

The Page Navigation section is designed to enhance user experience on long-form content pages by providing persistent access to different sections of your page. When you add this section through HubSpot’s drag-and-drop page editor, it automatically creates a fixed navigation bar that remains visible at the top of the browser window as visitors scroll through your content.

This section works particularly well for service pages, event agendas, case studies, and resource pages where you want to break content into digestible sections while maintaining easy navigation. The sticky behavior ensures users can jump to any section without scrolling back to the top, which is especially valuable for mobile users browsing lengthy content.

To set up effective page navigation, you’ll need to add anchor links to the modules or sections you want users to navigate to. In the HubSpot page editor, you can add these anchors by editing each target module and setting an anchor name in the advanced options. Then, configure your Page Navigation module to link to these anchors using the standard anchor link format (#anchor-name).

Best practices for this section:

  • Place it near the top of your page, typically after your hero section
  • Keep navigation labels concise and descriptive
  • Use this section on pages with 3-7 distinct content sections for optimal usability
  • Test the anchor links in preview mode to ensure smooth scrolling behavior

The Brightlane theme’s Page Navigation section maintains the clean, professional aesthetic while providing functional navigation that can significantly improve time-on-page metrics and reduce bounce rates for your longer content pieces.