Sections
Profile Picture of the author

Menus

on 01-08-2025 12:00 AM by SnapApp by BlueVector AI

1240

A Menu in SnapApp is a navigational component where you can add links or custom HTML elements to guide users through your application. Menus can appear in different positions, such as the header, footer, or sidebar, and can be configured to fit various use cases.

Table of Contents

How to Create a Menu?

Follow these steps to create your first menu:

  1. Go to Settings from the User menu on the top bar.
  2. Select Menus under UX on the left navigation bar.

Menus-1

  1. Click + Add New on the menu list page.

Menus-2

  1. Configure & Save Your Menu

Menus-Configuration

Example: Create a “Quick Links” menu for frequently accessed pages like Home, Profile, and Help.

Name: Give your menu a name, e.g., “Main Navigation”.

Location: Choose where it appears (Top, Footer, User menu, etc.).

Enable options like Mobile Full Width or Show Labels if needed.

Settings Description
Name Name of the Menu.
Location Location refers to the position where the Menu will be displayed.
  • Left: Menu will be displayed on left side
  • Top: Menu will be displayed on the top or header section
  • User: Menu will be displayed upon clicking the User icon
  • Footer: Menu will be displayed at the bottom or footer section
  • Embed:
Mobile Full Width Enabling this will make full width when viewed in mobile.
Show Labels Checkbox for whether to show the names of each Menu item or not.
Push Content If enabled, expanding Menu will push the body of the application, otherwise, it will be displayed over the body hiding some body contents.
Responsive If enabled, then for mobile devices, the Menu will be displayed at the bottom as a static component.
Collapse If enabled, an icon will be displayed on Menu for expanding the section.
Active Checkbox for turn on or off the a specific Menu.

Pro Tips for Menu Design

  • Keep it Simple: Avoid clutter by limiting menus to essential items.
  • Use Icons: Add visual icons alongside menu items for quicker identification.
  • Test Responsiveness: Ensure menus work seamlessly on all devices, from desktops to mobile.
  • Embed Menus Smartly: Use embedded menus to create shortcuts for frequently accessed pages.

How to edit a Menu?

  1. Open Settings from the User menu of the top bar.

  2. Select Menus from the UX menu on the left navigation bar.

  3. Select the specific Menu that you want to edit and click Edit button under Action field.

Edit

After creating a Menu, you will be able to add Navigation links and Custom HTML through Edit.

Adding Navigation items in Menus

Navigations

How to delete a Menu?

  1. Open Settings from the User menu of the top bar.

  2. Select Menus from the UX menu on the left navigation bar.

  3. Select the specific Menu that you want to delete and click the Delete button under Action field.

Delete

Thank you for following these steps to configure your SnapApp components effectively If you have any questions or need further assistance, please don’t hesitate to reach out to our support team. We’re here to help you make the most out of your SnapApp experience.

For support, email us at snapapp@bluevector.ai

Generate Text