Set up navigation

You're viewing Apigee Edge documentation.
Go to the Apigee X documentation. info

Set up navigation to link the pages that you have developed to your portal, as described in the following sections.

Explore the Menus page

Set up and publish the navigation menus in your portal using the navigation menu editor on the Menus page.

To access the Menus page:

  • Select Publish > Portals in the side navigation bar, select your portal, and click Menus on the landing page.
  • When editing your portal, select Menus in the drop-down menu in the top navigation bar.

Menus

As highlighted in the previous figure, the navigation menu editor enables you to:

About the default navigation menus

Two navigation menus are provided by default: Header and Footer. The default navigation menus appear in and link to the set of starter pages provided, as shown in the following figure.

Default menus

Add items to a navigation menu

To add an item to a navigation menu:

  1. Access the Menus page.
  2. Select the menu that you want to edit in the drop-down list (Header or Footer).
  3. Click + Menu Item.

  4. In the navigation menu dialog, enter the following details:

    Field Description Required?
    Name Name of the menu item as it will appear in the portal. This value can be different from the actual page name. Yes
    Page Path or URL Enter an absolute URL to an external page, an absolute or relative URL to a page in your portal, or click ... and select a page in your portal from the drop-down list. Yes

  5. Click Create.

  6. Click Publish to publish your changes to the live portal.

Rearrange menu items

To rearrange an item in a navigation menu:

  1. Access the Menus page.
  2. Select the menu that you want to edit in the drop-down list.
  3. Position your cursor over the menu item that you want to move to display the actions.
  4. Click and hold the mouse button over menu handle, to the left of the menu item name.
  5. Drag the menu item to its new location in the menu item list and release the mouse button.
  6. Click Publish to publish your changes to the live portal.

Create a submenu

A submenu displays as a drop-down menu when you overlay the parent item.

Submenu

To create a submenu:

  1. Access the Menus page.
  2. Select the menu that you want to edit in the drop-down list.
  3. Add a menu item that will serve as the parent menu.
  4. Add additional menu items that will serve as the submenus.
  5. Rearrange the submenu items so that they are under the parent menu in the desired order that you want them to appear in the menu.
  6. Position the cursor over the menu item that you want to add as a submenu and click Submenu icon to indent the submenu items one level under the parent menu. The following figure shows how a submenu item appears in the menu list:
    Submenu example
  7. Click Publish to publish your changes to the live portal.

To move a submenu item back to the top-level menu hierarchy, click Outdent submenu.

Edit a navigation menu item

To edit an item in the navigation menu:

  1. Access the Menus page.
  2. Select the menu that you want to edit in the drop-down list.
  3. Position the cursor over the menu item that you want to edit and click Edit icon.
  4. Edit the menu item details.
  5. Click Save.
  6. Click Publish to publish your changes to the live portal.

Publish a navigation menu

To publish a navigation menu;

  1. Access the Menus page.
  2. Select the menu that you want to publish from the drop-down list.
  3. Click Publish to publish the navigation menu.

Delete an item from a navigation menu

To delete an item from a navigation menu:

  1. Access the Menus page.
  2. Select the menu that you want to edit from the drop-down list.
  3. Position your cursor over the menu item in the list to display the actions menu.
  4. Click Delete icon.
  5. Click Delete to confirm the delete operation.
  6. Click Publish to publish your changes to the live portal.

Customize the menu items and navigation bar

Customize the font size and style of the menu items and other aspects of the navigation bar appearance, as described in Customize the navigation bar.