The Navigation tab is where you build the menus that guide visitors around your site. Kajabi includes default menus, such as the Main Menu and Footer, that appear on your pages until you assign a different menu.
Create custom menus when different pages need different links. On a sales page, for example, a custom menu can link only to the pages that help sell your Offer.
Add a navigation menu
From the Dashboard, click Website, then Navigation.
Click + New Navigation Menu in the top-right corner.
Enter a Title for your menu. Only you see it. Visitors never do.
Click Save Menu.
Your menu appears in the Custom Menus tab. To use it on a page, see Assign a navigation menu to a page later in this article.
Note: Navigation items inherit their font size and color from your page's Style Guide settings. To change how navigation items look, update the Fonts and Font Colors settings in your Style Guide. Learn how to customize your Style Guide.
Add links to a navigation menu
Links let visitors reach pages that aren't in your default navigation. Before you start, copy the URL or note the name of the Module, Lesson, or page you want to link.
In the Navigation tab, find the menu you want to change and click Add.
Select a link type:
Add Product: Link to a Module or Lesson.
Add Page: Link to a landing page, website page, or static page.
Add Link: Link to a site outside Kajabi or to a path on your site.
Enter the link text, up to 50 characters. The field is labeled Title for products and outside links, and Name for pages.
Choose the Module, Lesson, or page. For Add Link, enter a Path or URL that starts with
http://,https://, or/.Click Save.
Links to unpublished Modules, Lessons, and pages show a Draft label in the Navigation tab. Visitors don't see them until you publish the Module, Lesson, or page.
Tip: To link a navigation item to a specific section on a page, use an anchor link. Open the page editor, click the Section you want to link to, and copy the Section ID from the sidebar. Then add a navigation link using Add Link and enter the URL as /your-page-slug#your-section-id (for example, /home#about-us). Learn how to find and use Section IDs.
Edit navigation links and menus
Change a link, reorder your menu, or rename or delete a menu from the Navigation tab.
Edit or delete a link
In the Navigation tab, click the edit icon on the link.
Update the Title or Path or URL as needed.
Click Save.
To remove the link instead, click Delete in the same window and confirm.
Rearrange links in a navigation menu
Hover over the drag handle to the left of the link you want to move.
Click and drag the link to your desired position.
Note: Dragging a link below another link in the Navigation tab does not create a submenu or dropdown. To nest a page as a submenu item under a main navigation link, add a Dropdown Menu block to your header. See Add a Dropdown Menu to a header later in this article.
Rename or delete a navigation menu
In the Navigation tab, open the more options (...) menu for the menu you want to change.
Select Edit Title.
Enter a new Title and click Save Menu.
To delete the menu, click Delete in the same window and confirm.
Note: You can rename the default menus, but you can't delete them.
Show a link only to logged-in customers
Keep member-only pages, Course content, and other resources behind a login by hiding their link from everyone who isn't logged in to your site.
From the Dashboard, click Website, then Navigation.
Find the menu, then click the edit icon beside the link you want to restrict. To restrict a new link, add it first as described in Add links to a navigation menu.
Select Visible to logged in users only.
Click Save.
Assign a navigation menu to a page
After you build your menus, assign them to the pages of your site. By default, the Main Menu and Footer apply to every page until you assign a different menu.
When you assign one menu to several pages and later update a link in that menu, every page using the menu updates automatically.
To assign a menu, open the Header or Footer section in the editor for your:
Website and landing pages
Checkout pages
Course pages
Assign a menu to a website or landing page
Add menus to the header and footer of your website, landing, and funnel pages with the Menu block:
From the Dashboard, click Website, then Pages.
Locate the page you want to customize.
Click the page title or the color palette icon to Customize.
Open the Header or Footer section of the editor.
Select the Menu block, or click Add Content to add it.
Select your navigation menu from the dropdown.
Click Save.
To show submenu links under a menu item, add a Dropdown Menu block as described in Add a Dropdown Menu to a header later in this article.
Note: To change the color of your navigation menu, edit the Header Text Color option inside the Header section.
Assign a menu to a checkout page
Add a menu to the footer of your checkout page:
From the Dashboard, click Products.
Select the Sales tab.
Click Pricing.
Select the Offer you want to edit.
Click Edit checkout.
Select Footer, select the Link List block to add the navigation menu from the Menu dropdown.
Click Save.
Assign a menu to course pages
Add a menu to the header or footer of your Course pages:
From the Dashboard, click Products, then Courses.
Select the Course you want to customize.
Click the Customize tab.
Hover over the Template Preview and click Customize.
Open the Header or Footer section in the editor.
Go to the Menu section.
Select your navigation menu from the Menu dropdown.
Click Save.
Add a Dropdown Menu to a header
A Dropdown Menu block turns a header link into a list of links to Landing Pages, Offers, and more, so visitors see a streamlined menu instead of a row of links.
Note: These steps apply to Kajabi Pages templates. If you use Premier Legacy templates, learn how to add a Dropdown Menu with Premier.
Add a Dropdown Menu block
From the Dashboard, click Website, then select Website Pages or Landing Pages.
Open the page editor for your page. Learn how to open the page editor.
In the sidebar, open the Header section.
Click Add Block.
Select Dropdown Menu.
Customize a Dropdown Menu block
Use the block's settings to match your branding and control how the dropdown looks and behaves.
Set the dropdown colors
Set the Dropdown text color and Dropdown background color to complement your branding. Click the Color icon to select a color from your site color palette.
To use a custom color, click the color wheel, then enter your RGB color code or use the sliders:
The vertical bar selects the hue.
The square box selects the brightness and saturation.
The horizontal bar selects the opacity.
Change the dropdown text
Change the text displayed in your header to signal the Dropdown Menu to your visitors.
Show or hide the icon
Use Show icon to display or hide the down arrow icon for your Dropdown Menu. This setting is only available with Website Builder pages. Learn about the Website Builder.
Choose the menu
Select the navigation menu to use for the block in the Menu field. To create or change the menu, see Add a navigation menu and Add links to a navigation menu earlier in this article. To jump to your menus from the block, click Edit your link lists below the Menu field in the sidebar editor.
Open links in a new tab
Turn on Open in new tab to open the selected menu item in a new tab of your visitor's browser.
Align the dropdown links
Use Dropdown menu alignment to align the text of each link in your Dropdown Menu to the left, center, or right.
Stretch the block
Turn on Stretch block to fill the remaining space in the header. Turn it on for the block on the far left of your header. For example, to place your Logo on the far left and a Menu and User Menu on the far right, select Stretch block for your Logo. Adjust Stretch block and the alignment settings together to control the position of each block in your header.
Align the block in the header
Use Text alignment to place your block toward the left, center, or right of the header. Surrounding blocks and their alignment also affect this setting.