Secondary Navigation

Secondary navigation menus are essential for enhancing user experience by providing quick and efficient access to additional features and content within an app. This guide will walk you through the steps to add and customize a secondary navigation menu in your app.

Key Features of Secondary Navigation

1. Enhanced User Experience
Secondary navigation menus improve usability by offering easy access to various features and sections of the app.
2. Positioning
The secondary navigation menu appears at the bottom of the screen, just above the bottom navigation bar, if configured.
3. Expanded View
Adding more than three links will enable an expanded view, providing better detail and visibility with icons.

Step-by-Step Integration of Secondary Navigation

1. Add Secondary Navigation Add-on

Click on "Add" button to add Secondary Navigation Bar. Once you add, it will appear in Add-ons menu. After adding the add-on, you will see the settings option in the section.

2. + Add Secondary Navigation bar

Click on "+ Add Secondary nav bar" to go further in creating your navigational bar.

3. Secondary Navigation Bar Items

• Add Items: Click Add Item to upload an image, enter a label, and provide the URL for each navigation item.

• Add More Items: You can add additional items by clicking on "Add".

4. Label Settings

• Text and Background Color: Adjust the text color, background color, and button margin to match your app's design.

• Real-Time Preview: All changes can be viewed in real-time to ensure the navigation looks exactly how you want.

Click on the "Next" button to proceed.

5. Display Configuration

Choose where you want to display the navigation bar menu:

• All pages: Show the navigation tab on all screens of your app.
• Exact URL: Modify the component to display the bottom navigation only on exact URL matches.
• Start with URL: Extend the logic to show the bottom navigation on pages that start with specified URL prefixes.

click on the "Save" button. Rebuild your app to apply and view the changes. This will ensure that the new secondary navigation is functional and visible in your app.