DNN MegaMenu

•Building a double wide “mega menu” for DNN using BrandonHayes DNN module. •Visit and support Brandon at http://www.codeplex.com/site/users/view/BrandonHaynes

SolTech Inc http://www.soltech.net 1-404-601-6000

http://dnntemplatedmenu.codeplex.com/

Download and load the module from http://dnntemplatedmenu.codeplex.com/

A derivative of the built-in DotNetNuke DNNMenu navigation provider, allowing for templated custom menu panels. Configure one or more menu items to be displayed using a (built-in or custom-developed) template, yielding display options not before available to DotNetNuke users!

This provider is installed just as any other module or provider through the

Host->Modules menu item.

Note that the provider requires DotNetNuke version 5.0.1 or greater; ensure that your installation meets this minimum requirement before proceeding.

InstallTo install:

Log in as a host userInstall the TemplatedDNNMenuNavigationProvider install package,Optionally install the Templated MinimalExtropy skin package, or any other skin configured to utilized the templated provider,Change a page (or site) skin to use a skin that utilizes the templated provider.

The default template is located at /Providers/NavigationProviders/DNNTemplatedMenuNavigationProvider/Default.ascx.

Configuration and UsageNavigate to the settings for the page that is the root of the menu you wish to template (e.g. the Admin page) and in “Advanced Settings”, Page Header Tags textbox, enter the string

<meta name="menuTemplate" content="" />

Return to the page you specified to use the template skin, and note that the tagged menu is now using the default template (which is not that attractive until the pages have been structured into a better hierarchy). The default template displays children in a large font; grandchildren are in a normal font. You’ll have to use the Admin->Tabs page to rearrange some tabs to see this behavior.

Selecting TemplatesThe default template is located at /Providers/NavigationProviders/DNNTemplatedMenuNavigationProvider/Default.ascx.

You can specify an alternate template by adding its name to the

content portion of the meta tag; by way of example,

a tag that reads as below will use the Descriptions.ascx

template, which displays a page’s description

(if any) underneath its link.

<meta name="menuTemplate" content="Descriptions" />

Skin designers can deploy their own templates; these may be accessed via a tag of the form:

<meta name="menuTemplate" content="skin:[TemplateName]" />

or

<meta name="menuTemplate" content="portal:[TemplateName]" />

Template Examples

CSS Styling

A template CSS can be specified through another meta tag, formatted as

<meta name="menuCss" content="CssFile" />

• A “portal:” or “skin:” prefix may be used; if none are specified the css is drawn from the provider directory

Embed this into a DNN skinInstantiate an Admin/Skins/Nav.ascx control as

<%@ Register TagPrefix="dnn" TagName="NAV" Src="~/Admin/Skins/Nav.ascx" %>

Place the menu in the skin … remember to tell dnnmenu what styles to use … , here CSSNode defines the styling of the megamenu wide container

You can include any or all of the properties available on the DotNetNuke Nav control. The templated menu provider does not directly use any of these; they are passed as-is to the DNNMenu provider

SolTech and DNN

SolTech has built hundreds of client websites and business solutions using DNN.

From simple sites to complete 500 page + sites with custom , from scratch DNN modules.

We should be talking.