Navigation

The different ways you can build and customize navigation in your apps

The navigation bar helps users find their way around your app. While in the builder mode, you can access all the pages. The great news is that Jet allows you to craft as many as three menus and combine them. And guess what, you can also personalize your navigation! Here's how you can do it:

Configure menu layout
Manage menu Items
Set up the menu background color
Enable/Disable the menu, set conditional visibility via the Fx button

There are two types of menu layouts Vertical and Horizontal. Each class has different visibility:

Vertical (Left positioning)

Thin width
Wide width

Horizontal (Top positioning)

Primary menu
Secondary menu
Inner menu – if you would like to use a combination of a vertical and horizontal menu

You can apply different colors to the menu background. Select menu -> click Color

There are three menu item positionings that you can put items depending on layout:

left/top
center
right/bottom

Customize the menu items by:

Adding new links to your internal/external pages
Grouping menu items by using Group
Adding Components
Rearrange menu items

Grouping allows you to group different menu items in sections or dropdowns.

Section

Dropdown

Separator

Page
Custom Link
Section
App Logo
Current User
Icon / Image
Button
Dropdown
Separator
Open Home
Open User Profile
Open Users & Teams
Open Activity Log Slideout
Open Activity Log Page
Open Collaboration Slideout
Open Collaboration Tasks
Open Collaboration Messages
Toggle Light/Dark mode
Logout
App members
Custom Component

App logo

Current user

Icon/Image

Button

Logout

App members

Toggle light/dark mode

Jet allows you to set up Conditional Visibility for each menu item, as well as the whole menu bar.

Click on menu item settings -> Customize item.

PreviousIntro to Data NextMenu Conditional Enabled

Last updated 1 year ago

Was this helpful?