The Inventua TopMenu displays a horizontal list of hyperlinks used for navigation within DotNetNuke, and can change the style of the displayed items when the user moves the mouse over a menu item. The display styles of the menu is entirely css-driven, and you can configure the "source" menu, so the module can be used from any page level.

Configuration Options
Create a TopMenu instance and select the Options menu item from the module settings menu to display the Options page.  If you are using the TopMenu as a skin object, you can use the properties specified here and include <OBJECT> and <TOKEN> nodes in your skin.xml file as described in the DNN skinning documentation. For more information, refer to the "Using TopMenu as a skin object" topic below.

Source	Use the source page combo to select the base page to use for this instance of the TopMenu. You can select [Root Page] to display a hierachical view of all tabs, or you can select a child page to display only that page and it's children. You can suppress the display of a page by setting it's "Disabled" property in the DotNetNuke page manager. The TopMenu will only display tabs that the currently logged-on user has access rights to.  If you are using the TopMenu as a skin object, the property name for this option is "source".  Special values: [root page]: Top level root page for the current portal.  If used in a skin, use the value -1. [current page]:   Shows the child items of the current page only.  If used in a skin, use the value -2. [parent page]:   Shows the current page's parent and it's child tabs.  If used in a skin, use the value -3. [top ancestor]:   Shows the current page's "highest" ancestor page and its child tabs.  If used in a skin, use the value -4. [dual]:  If the current tab is a top-level tab (no parent), displays the menu the same as the [current tab] option.  If the current tab is not a top-level tab, draws the menu the same as the [top ancestor] option.  If used in a skin, use the value -5.  [dual] is intended for large sites (where showing the entire page tree is not practical), or for page designs that show the top level tabs either across the top of the page or in another menu instance.
MenuBar css class	Use this option to set the menu bar css class name in your skin or portal css file. The default value is TopMenuItem. Menu items are rendered on top of the MenuBar, so this can be used to set background colours, etc.  If you are using the TopMenu as a skin object, the property name for this option is "MenuBarCssClass".
Item css class	Use this option to set the menu item css class name in your skin or portal css file. The default value is MenuItem . If you are using the TopMenu as a skin object, the property name for this option is "MenuItemCssClass".
Item Highlight css class	Use this option to set the "highlighted" css class name in your skin or portal css file. The highlight css style is used to highlight the menu item under the mouse pointer. The default value is MenuItemMouseOver. If you are using the TopMenu as a skin object, the property name for this option is "MenuHighlightCssClass".
Current Item css class	Use this option to set the "current" page's css class name in your skin or portal css file. The Item current page css class is used to highlight the currently displayed page, if the current page is being drawn as a menu item. The default value is blank (empty string). If you are using the TopMenu as a skin object, the property name for this option is "CurrentItemCssClass".
Seperator	Use this option to set the seperator character between menu items, or leave the setting blank to not draw any menu seperator. If you are using the TopMenu as a skin object, the property name for this option is "Seperator".
Disregard Hidden Flag	Show hidden tabs.  Normally, hidden tabs are not displayed. If you are using the TopMenu as a skin object, the property name for this option is "IgnoreHidden".
Disregard Disabled Flag	Normally the TopMenu uses disabled property for menu headings:  If the page is disabled, the menu header is drawn as static text (that is, clicking on the menu header has no effect).  If the page is not disabled, the menu header is drawn as a hyperlink. If you are using the TopMenu as a skin object, the property name for this option is "IgnoreDisabled".
Display page Name instead of Title	Displays the page's Name property rather than using the Title property. If you are using the TopMenu as a skin object, the property name for this option is "UseName".
Disable Javascript	Turns off ALL Javascript rendering - This option is for users who want to render a menu that does not require Javascript. No mouseover commands are executed, so the Highlight CSS class has no effect. If you are using the TopMenu as a skin object, the property name for this option is "DisableJavascript".
Show Icons	Displays the page's icon to the right of the menu item or header. If you are using the TopMenu as a skin object, the property name for this option is "ShowIcons".
Show Description	Renders the page's description beneath the page name (or title), if a description has been set for the page. The page is rendered with CLASS= cssclassDescription, where cssclass is the header or item css class used for the page.

ID Attributes
Each menu item (and header) is tagged with an ID attribute, in the form "invtopmenu-tabname", where tabname is the name of the page with spaces and illegal characters filtered out (if you are having trouble identifying a menu item's ID, use View Source in your browser to determine what ID is being used).  You can use the ID in your CSS to specify a special style for specific menu items.  For example, the CSS to draw a page named "About" in yellow text is:

  #invtopmenu-About {color: yellow}

Using TopMenu as a skin object
The Inventua TopMenu is installed as both a module and a skin object automatically when you install it using the DNN file manager. Add the TopMenu to your portal skin by including a [INVTOPMENU] token. You can set the properties of the control using a skin.xml file as documented in the DNN Skinning Guide, Appendix B. The "Configuration Options" section above describes the available properties.

For example, to configure the TopMenu to display the child items of page 10, use the following xml in yourskin.xml:

Using QueryString items to control the TopMenu
If you pass querystring values matching TopMenu attribute names to a page, the TopMenu will use the values you pass.  For example, you could use the URL http://yoursite.com?RootTab=6 to display the menu using page number 6 as the root page.