How to Display Links in Your App's Page Menu Based on User Access

In this article, we will share how you can limit page links displayed in the page menu based on the logged-in user's access.

Example Use Case

Let's say you're developing an e-learning app where different courses are accessible to users based on their subscription level or membership type. In this case, you'd want to customize the page menu to only display links to courses that the logged-in user has access to.

This ensures that users see only the relevant course options available to them, streamlining their navigation experience and enhancing the app's usability.

Requirements

If you have not enabled users, created login pages, or set up user roles tables yet, you can find detailed information about each in our related articles:

Steps


 

1.  Ensure Your Page Permissions are Set for Each Login Page

First, it is essential to ensure that the appropriate user role(s) are set for access on each login page. To do this, you can select any login page and either select to edit the login view directly or select the lock icon that's located to the right of the page settings:

pagemenulinks1

2.  Include Necessary Pages in the Page Menu

Next, it is important to verify that the pages included in the page menu are the ones that users should have access to select from.

For instance, you might have a scenario where a page should only be accessible to users with the direct URL, without restricting permissions based on specific user roles. In this case, you wouldn't want this page to appear in the page menu. 

To do this you can access the page settings for each page, and select/unselect the checkbox for "Include this page in the Page Menu":

pagemenulinks2

Tip:  To learn about page settings, see our articles here: Page Settings & How to Update Your Page's Settings

3.  Edit Your Live App Design Settings 

The most important step requires you to navigate to Settings (located in the left navigation menu) > Live App Design > Header & Page Menu in order to update the page menu option. From here, under Page Menu options, select the checkbox to "Only show links the user has access to":pagemenulinks3

4.  Check Your Page Menu in the Live App

Lastly, it is recommended to access your Live App to verify that the page menu reflects the intended pages based on the user role assigned to the logged-in user. A practical approach is to create a test user account, assign each user role individually for testing purposes, and then log in to your app using this user account to review the page menu options.

pagemenulinks4