Types of Menus

Types of Menus

mojoPortal builds the site menus automatically from the pages available in the site. If a page does not have the "Show In Menu" option selected, it will not be in any menu. If a user does not have access to a page, that user will not see the page in any menu.

Generally, mojoPortal has four different types of menus; Site, Page, Child Page, and mojoMenu. Each of these menus serves a different function and thus has different options.

Site Menu

The site menu is the main menu for the site. It is populated with root level pages that are set to be included in the menu.

Example:

<portal:SiteMenu id="SiteMenu1" runat="server" UseTreeView="false" HideMenuOnSiteMap="false" TopLevelOnly="false" IncludeCornerRounders="false" />

Available Site Menu settings (defaults are bold):

  • Direction - Horiztonal or Vertical.
  • HideMenuOnSiteMap - True or False. If set to true, the Site Menu will not be visible on the SiteMap page.
  • IncludeCornerRounders - True or False. If set to false, the Corner Rounder divs will not be displayed around the menu.
  • StartingNodeOffset - Set to a numerical representation of the node level you want the menu to start displaying. This is helpful when you use two or more horizontal menus in conjunction with a vertical menu as described in the Multiple Horizontal Menus article. In this case, you would set the StartingNodeOffset=2 which instructs the menu to display pages in node level 3 and beyond.
  • SuppressPageSelection - True or False. If set to true, the menu will not indicate the current page.
  • TopLevelOnly - True or False. If set to ture, the menu will display only the pages whose parent is root.
  • TreeViewExpandDepth - Set to a numerical representation of the number of levels you want the menu to expand by default. Consider the following example:
    • A site has three root level pages: Home, About and Services. The About page has one sub-page named History. The History page has one sub-page named '1st 100 Years'. With the TreeViewExpandDepth set to 1, the menu would be similar to figure 1. With the TreeViewExpandDepth set to 2, the menu would be similar to figure 2.
      Menu with TreeViewExpandDepth=1
      (figure 1)
      TreeViewExpandDepth=1
      Menu with TreeViewExpandDepth=2
      (figure 2)
      TreeViewExpandDepth=2
       
  • TreeviewPopulateNodesFromClient
  • TreeViewPopulateOnDemand
  • TreeViewShowExpandCollapse
  • Use3SpansInLinks - True or False. If set to true, three Span elements will be added to each menu item's link (<a>). This property is used to apply left and right tab images or other styling to the menu item.
    • <span class="menutext">Menu Item Text</span> Used to apply style to the menu item text.
    • <span class="tab-l">&nbsp;</span> Used to apply style to the left side of the menu item text.
    • <span class="tab-r">&nbsp;</span> Used to apply style to the right side of the menu item text.
  • UseSpanInLinks - True or False. If set to true, the menu item's link will include a Span element around the text. This property can be used to apply additional styling to the text of a menu item. The span has no CSS Class assigned to it.
  • UseSuperfish - True or False. If set to true, the menu will be rendered using CSS classes specifically for SuperFish menus. This setting must be used in conjunction with the SuperFish menu javascript and CSS. For more information, please see the Using SuperFish Menus documentation.
  • UseTreeView - True or False. If set to true, a treeview menu will be displayed and the menu will be displayed vertically regardless of the Direction setting. This property should be used with TopLevelOnly=False.

Page Menu

The Page Menu lists the pages beneath the current page that are set to be included in the menu.

Example:

<portal:PageMenu id="PageMenu1" runat="server" UseTreeView="false" Direction="Vertical" />

Available Page Menu setttings (all of the Site Menu settings can be used with the Page Menu except HideMenuOnSiteMap, SuppressPageSelection and TopLevelOnly):

  • DynamicDisplayLevels -
  • SiteMapDataSource -

ChildPageMenu

When Show Child Page menu is enabled in Page Settings a menu of pages beneath the current page is shown. This is useful for pages that are just a parent to other pages but have no content themselves.

Available Child Page Menu settings:

  • CssClass

mojoMenu

mojoMenu is the ASP.NET Menu control that is configured to use the CSSFriendly Adapters. This menu can be useful for generating custom menus in mojoPortal. All of the properties that apply to the asp:menu control apply to the mojoMenu.