# Application Menu

Your application's menu is located along the left-hand side of your application in desktop mode, and along the top of the application in mobile mode. You can access these components by viewing wood/ui/templates/AppTemplate/SideBar.vue and wood/ui/templates/AppTemplate/TopBar.vue, respectively.

These menus are configured by editing the appMenuEntries field in app/config/ui.js. This will originally not be present, but you can copy the entry from wood/config.ui.js and edit it. For reference, it will look like:

  /**
   * @type {Array<Object>} Menu items that appear in the app sidebar.
   */
  appMenuEntries: [{
    name: 'Home',
    path: '/',
    icon: 'fa-home',
  }, {
    name: 'About',
    path: '/about',
    icon: 'fa-tasks',
  }, {
    name: 'Components',
    path: '/components',
    icon: 'fa-columns',
  }],

Every entry in the array is a new link in the sidebar, with these properties:

  • name: This is the name displayed next to the icon on the sidebar.
  • path: This is the application route that the user will be navigated to when the link is clicked. So /about will navigate the user to /app/about, / will navigate just to /app, etc.
  • icon: This is a CSS class that will define which icon is used to represent this link. By default, the free version of Font Awesome is included in Nodewood, so you can use any of the free Font Awesome icon classes (opens new window), but if you've installed the professional version (or another icon pack), you can use those classes as well.

# Admin Menu

The admin section of your site also has a SideBar and a TopBar, located in wood/ui/templates/AdminTemplate. These menus are configured by editing the adminMenuEntries field in app/config/ui.js. They have the same properties as appMenuEntries.

# User Menu

Secondary menu entries that are more-specifically related to the current user, like Profile and Support are accessed from the User Menu, which in desktop mode is a dropdown in the upper-right of the screen, and in mobile mode is appended to the TopBar.

These menus are configured by editing the userMenuEntries field in app/config/ui.js. They have the same properties as appMenuEntries, except that they do not have an icon property.