---
sourceDocument: Australia Build or modify applications
sourceDocumentLink: https://servicenow-prod.fluidtopics.net/r/application-development

 Release :

    - australia

ft:locale :

    - en-US

ft:publication_title :

    - Australia Build or modify applications

ft:clusterId :

    - cadev

bundleId :

    - cadev

workflow :

    - Development, Data, and Analytics


---

# Add a page to the navigation

# Add a page to the navigation {#ariaid-title1}

Release version: Australia  
Updated August 6, 2026  
![](https://www.servicenow.com/docs/portal-asset/ico-clock) 1 minute to read  
Add pages to the navigation to make them accessible from other pages, such as a home page.

## About this task

Some pages are added to the navigation by default when you create them. For pages that aren't added automatically added to the navigation, use the following procedure to make them display and accessible via other pages.

The following procedure describes how to complete this task manually. You can also complete the task using agentic development tools, such as Claude Code.

## Before you begin

Role required: none  
The ServiceNow Lux Lab for VS Code extension requires the following:{#add-page-to-navigation-servicenow-ai-experience-lab-for-vs-code__table_imf_rfb_dkc__entry__3}

| Application | Version | Resources for more information |
|-|-|-|
| Visual Studio Code | 1.97 later | [Visual Studio Code updates](https://code.visualstudio.com/updates/v1_132) |
| Node.js | 24 or later | [Node.js](https://nodejs.org/en/download) |
| pnpm | 10 or later | [pnpm](https://pnpm.io/installation) |
| ServiceNow SDK | 4.10 or later | [ServiceNow SDK](https://www.npmjs.com/package/@servicenow/sdk) |
| ServiceNow instance | * Australia Patch 5 or later * Zurich Patch 12 or later {#add-page-to-navigation-servicenow-ai-experience-lab-for-vs-code__ul_xtl_bgb_dkc} | [Prepare your upgrade](https://www.servicenow.com/docs/access?context=rn-prepare-landing-page&version=australia&pubname=australia-release-notes&ft:locale=en-US) |
[ ]

{#add-page-to-navigation-servicenow-ai-experience-lab-for-vs-code__table_imf_rfb_dkc}

## Procedure

1. Select the ServiceNow ![]() icon in the side panel to open the ServiceNow Lux Lab for VS Code extension.
2. Open a net new or extension experience.
3. **Optional:** If your project doesn't already have an application.js file, at the experience folder root (not under `src/extensions/`), add an application.js file.  
   Tip:  
   Use the nav helper API from `@servicenow/aiux/aiux-components-nav` rather than adjusting the `navLayoutContext` by hand.
4. Double-click (or use the keyboard shortcut) to open the `application.js` file in explorer.
5. Add the following lines of code to the application.js file with the page name and target path that you want to add.  
   Note:  
   To add pages to L2, include an `l2Nav: [{icon, title, action}]` array on the L1 page you pass to `addNavItem`. The page accepts {icon, title, action, l2Nav?, l3Nav?}.
   {#add-page-to-navigation-servicenow-ai-experience-lab-for-vs-code__table_ph2_jnv_dkc__entry__2}

   | Action | Code to add in application.js |
   |-|-|
   | Add pages to L1 sidebar | `addNavItem(item, {source?})` |
   | Set (replace) the L3 tab array on any L1 or L2 page by path | `setL3Nav(targetPath, l3Nav)` |
   | Append tabs to an L1 or L2 page, keeping any tabs already present | `appendL3Nav(targetPath, l3Nav)` |
   [ ]

   {#add-page-to-navigation-servicenow-ai-experience-lab-for-vs-code__table_ph2_jnv_dkc}
6. Save the file.
7. In the Script Runner panel, select Build.
8. Verify that the added page appears at the expected navigation level using the Quick Preview panel or by deploying to your instance.  
   For more information, see the following resources:
   * [Preview a page](https://servicenow-prod.fluidtopics.net/Gz2B8HzYv34O4XiwEdYP0Q "Test that your page appears and functions as intended.")
   * [Deploy changes](https://servicenow-prod.fluidtopics.net/lkms_hSGIgeb2EwQkZwQTg "Deploy your changes to an instance to preview and publish experiences, pages, and widgets.")
   {#add-page-to-navigation-servicenow-ai-experience-lab-for-vs-code__ul_tdh_x4v_dkc}