0 votes

Simple Nav Menu

INTRO:

Simple Nav Menu is a server control for use in an Umbraco installation which renders an unordered list based navigation menu. There are lots of properties which can be used to easily customize the rendering such as the maximum nesting level, first/last/selected css classes, filtering by document types, rendering item ID's for each list element etc.

The package installs a dll which once referenced in the Visual Studio toolbox allows a server control to be dragged onto any master page template. The package also contains an absolutely minimal stylesheet to allow the sub navigation to drop down on hover of its parents. The idea is to build it on with your own styling to integrate it into the design of your site.

INSTALLATION:

1. Once the package is installed, ensure SimpleNavMenu.dll is in the bin folder and the SimpleNavMenu.css is in the css folder.

2. In Visual Studio install the server control by right clicking on the toolbox, and choosing "Choose Items". On ".NET Framework Components" click "Browse", choose the SimpleNavMenu.dll and click "Ok".

3. You should see the SimpleNavMenu in the toolbox so drag it wherever you want onto a masterpage template.

4. Reference the CSS file in the master page head using something like: <link rel="stylesheet" href="<%= ResolveUrl("~/css/SimpleNavMenu.css") %>" media="all" />

5. All you need to do now is set the "RootNodeId" to the node id of your most top level page or page whose children you want outputting for the menu.

6. You can see what properties are available by pressing space in the server control to popup IntelliSense and scrolling the list of properties.

The menu contains Polyglot integration which can be used by setting the following:

1. Install and configure Polyglot.

2. On the Simple Nav Menu server control, set the "UsePolyglotTranslation" property to true.

3. In the web.config the "uPolyglotDefaultLanguage" property must be set to your default language.

4. As the culture code is used for the node name of translated documents, the "documentName" property is used for the translated document node names.

This is a work in progress and welcome any feedback to fix any issues or improve the addon. Depending on the popularity I will consider adding functionality such as allowing the menu to render as a mega menu or table based layout etc.

Screenshots

Package owner

John Briscombe

John Briscombe

John has 20 karma points

Package Compatibility

This package is compatible with the following versions as reported by community members who have downloaded this package:
Untested or doesn't work on Umbraco Cloud
Version 8.18.x (untested)

You must login before you can report on package compatibility.

Previously reported to work on versions:

Package Information

  • Package owner: John Briscombe
  • Created: 20/04/2013
  • Current version 1.1
  • License MIT
  • Downloads on Our: 1K

External resources