User Menu

What is a User Menu?

The User Menu component is a System Component that, when added to a page or layout, adds a navigation menu bar with Special Links that route users to accomplish user-related functions including Login, Logout, Profile, and Sign Up.

Special links include links to user-related functions including Login, Logout, Profile, and Sign Up. These links are "special" because they are dynamic to the user's logged-in status, meaning the links to Login, Logout, Profile, and Sign Up show or hide on a user menu based on whether or not the user is logged in to your app. 

In this way, user menus are dynamic to the logged-in status of your users.

For instance, if the user is not logged in, the user menu will display a Login link and Sign Up link. 

If the user is logged in, the user menu will display a Logout Link as well as a Profile Link displayed as the user's name. When logged in users click on their names, they will be routed to their individual profile pages. 

For instance, if logged in user, Jason Anderson, clicks on his name on the user menu he will be routed to the default profile page where he can update his profile information.

Click here to learn more about customizing the profile system component within the profile page.

Adding User Menus

You can add a user menu component to a page or layout by adding it within an existing column, similarly to how you would add any other component.

Depending on the row/column in which you add the user menu component is where the user menu will display on your live app. For instance, if in a layout you add a user menu component within the right column of a 2-column row that has a breadcrumbs system component within the left column, and above this row is a row/column with a menu system component, this layout will appear as such in the Page Builder:

And will display as such on your live app when the page assigned to this layout loads within the page container.

Whichever column you choose to add a user menu component, once you select the column you can then add the user menu by selecting it from the list of System Components.

A new window will pop up prompting you to configure your user menu with two settings. 

Show registration/signup link

The registration/sign up link is set to be shown on the user menu when users are not logged in. Meaning, by default, when users are not logged in to your app they will see a Sign Up special link on the user menu.

You can choose to change this setting to "No" if you wish to remove the Sign Up special link from the user menu regardless of whether the user is logged in or logged out.

Logout redirect rules

You can add custom role-based rules to your user menu to automatically route specific users to specific pages when they click on the Logout special link on the user menu. You can add multiple Logout Redirect Rules to custom-route multiple user roles to specific pages upon logout. To add a new Logout Redirect Rule, click on the +Add New Redirect Rule button.

You can then create your custom role-based logout routing rule. For instance, if the user's role is "Team Member" then redirect the user to the Login page upon logout/clicking on the Logout special link on the user menu.