Navigationmenuprovider; dit skinobject genereert een standaard DotNetNuke menu. Dit menu heeft meer mogelijkheden dan de eerste menuprovider van DotNetNuke (Solpartmenu).
Om gebruik te maken van het NAV menu dien je in de skin het skinobject te registreren; dit gaat middels ondertaande code (plaats deze bovenin de skin).
<%@ Register TagPrefix="dnn" TagName="Nav" Src="/portals/16/~/Admin/Skins/nav.ascx" %>
Nu dat het skinobject in de skin is geregistreerd kunnen we deze aanroepen door het control te plaatsen op de juiste plek in de skin; hieronder een
standaard manier van aanroepen (daarbij valt het menu terug op standaard stijlen):
Behalve bovenstaande controls zijn er nog extra controls toe te voegen voor extra functionaliteit aan het menu.
Opbouw menu
ForceDownLevel - Forceert het submenu te tonen (Waarden: true, false)
ForceCrawlerDisplay - Toont het hele menu als een lijst van normale hyperlinks (als bij een sitemap; Waarden: true, false)
ControlOrientation - Bepaalt hoe het menu wordt getoond; horizontaal of verticaal (Waarden: vertical, horizontal)
ControlAlignment - Uitlijning van het menu binnen de menubar. (Waarden: Left|Center|Right|Justify)
HTML
NodeLeftHTMLRoot - voegt HTML toe aan het begin van de rootmenu-items
NodeRightHTMLRoot - voegt HTML toe aan het einde van de rootmenu-items
NodeLeftHTMLSub - voegt HTML toe aan het begin van de submenu-items
NodeRightHTMLSub - voegt HTML toe aan het einde van de submenu-items
NodeLeftHTMLBreadCrumbRoot - voegt HTML toe aan de linkerkant van het item dat in het hoofdmenu zit en het kruimelpad zit
NodeRightHTMLBreadCrumbRoot - voegt HTML toe aan de rechterkant van het item dat in het hoofdmenu zit en het kruimelpad zit
NodeLeftHTMLBreadCrumbSub - voegt HTML toe aan de linkerkant van het item dat in het submenu zit en het kruimelpad zit
NodeRightHTMLBreadCrumbSub - voegt HTML toe aan de rechterkant van het item dat in het submenu zit en het kruimelpad zit
SeparatorHTML - Een scheidingsteken tussen hoofdmenuitems. Dit kan bestaan uit HTML, afbeeldingen en tekst (bijvoorbeeld: ]]> )
SeparatorLeftHTML - Een scheidingsteken alleen aan de linkerkant van een hoofdmenuitem. Dit kan worden gebruikt als een achtergrondafbeelding voor bijvoorbeeld een tabje
SeparatorRightHTML - Een scheidingsteken alleen aan de rechterkant van een hoofdmenuitem. Dit kan worden gebruikt als een achtergrondafbeelding voor bijvoorbeeld een tabje
SeparatorLeftHTMLActive - Een scheidingsteken aan de linkerkant van een actief hoofdmenuitem.
SeparatorRightHTMLActive - Een scheidingsteken aan de rechterkant van een actief hoofdmenuitem.
SeparatorLeftHTMLBreadCrumb - Een scheidingsteken alleen aan de linkerkant van een hoofdmenuitem dat in het kruimelpad zit
SeparatorRightHTMLBreadCrumb - SeparatorLeftHTMLBreadCrumb - Een scheidingsteken alleen aan de rechterkant van een hoofdmenuitem dat in het kruimelpad zit
Stylesheet Klassen
CSSControl - Css klasse die gebruikt wordt voor de menubar
CSSContainerRoot - Css klasse die gebruikt wordt voor de menucontainer
CSSContainerSub - Css klasse die gebruikt wordt voor het submenu
CSSBreak - Css klasse die gebruikt wordt voor de ruimte tussen de menuitems
CSSIndicateChildSub - Css klasse voor het pijltje om aan te geven dit menuitem onderliggende pagina's heeft
CSSIndicateChildRoot - Css klasse voor het pijltje om aan te geven dit hoofdmenuitem onderliggende pagina's heeft
CSSNode - Css klasse voor alle menuitems (indien geen andere gespecificeerd)
CSSNodeRoot - Css klasse voor alle hoofdmenuitems (overschrijft CSSNode)
CSSBreadCrumbSub - Css klasse voor submenuitems die in het kruimelpad zitten
CSSBreadCrumbRoot - Css klasse voor hoofdmenuitems die in het kruimelpad zitten
CSSNodeSelectedRoot - Css klasse voor hoofdmenuitems wanneer deze actief zijn
CSSNodeSelectedSub - Css klasse voor submenuitems wanneer deze actief zijn
CSSNodeHover - Css klasse voor menuitems met een mouse-over (geldt voor alle menuitems)
CSSNodeHoverRoot - Css klasse voor hoofdmenuitems met een mouse-over (overschrijft CSSNodeHover)
CSSNodeHoverSub - Css klasse voor submenuitems met een mouse-over (overschrijft CSSNodeHover)
CSSSeparator - Css klasse voor alle hoofdmenuitem scheidingstekens
CSSLeftSeparator - Css klasse voor scheidingsteken links
CSSRightSeparator - Css klasse voor scheidingsteken rechts
CSSLeftSeparatorSelection - voor scheidingsteken links wanneer deze acties is
CSSRightSeparatorSelection - voor scheidingsteken rechts wanneer deze actief is
CSSLeftSeparatorBreadCrumb - voor scheidingsteken links wanneer deze zich in het kruimelpad bevindt
CSSRightSeparatorBreadCrumb - voor scheidingsteken rechts wanneer deze zich in het kruimelpad bevindt
CSSIcon - Css klasse voor het icoontje bij een menuitem
Stijlen en kleuren
StyleBackColor - Achtergrondkleur
StyleForeColor - Voorgrondkleur van een menuitem wanneer deze is geselecteerd
StyleHighlightColor - De kleur van de rand aan linker- en bovenkant om een highlighteffect te creeeren
StyleIconBackColor - Achtergrondkleur voor het gedeelte waar de icon staat
StyleSelectionBorderColor - Kleur van de rand die om het geselecteerde menuitem staat
StyleSelectionColor - Achtergrondkleur van een geselecteerd menuitem
StyleSelectionForeColor - Voorgrondkleur van een geselecteerd menuitem
StyleControlHeight - Hoogte van de menubar in pixels
StyleBorderWidth - Grootte van de rand om het menu in pixels
StyleNodeHeight - Hoogte van een menuitem in pixels
StyleIconWidth - Breedte van een menuitem in pixels
StyleFontNames - Te gebruiken lettertypen
StyleFontSize - Te gebruiken lettertype-grootte
StyleFontBold - Te gebruiken stijl voor lettertypen
Effecten
EffectsShadowColor - Kleur van de schaduw
EffectsTransition - Bepaalt welke overgang moet worden getoond
EffectsDuration - Aantal seconden die de overgang duurt
EffectsShadowDirection - Aan welke kant de schaduw moet vallen
EffectsShadowStrength - Bepaalt hoe transparant de schaduw is
EffectsStyle - Eigenschap werkt alleen in IE; voor overgangen in het submenu
Eigenschappen voor de muis
MouseOutHideDelay - Aantal milliseconden voordat het menu verdwijnt nadat de muis eruit is. (0 = uit)
MouseOverDisplay - Toont effecten wanneer je met de muis over een menuitem hovert (Waarden: Outset, Highlight, None)
MouseOverAction - Klapt het menu uit wanneer je met de muis over een menuitem hovert (Waarden: True, False)
Indicatiepijlen
IndicateChildren - gebruik pijltjes om aan te geven dat er een submenu is
IndicateChildImageSub - geeft aan welk pijltje (afbeelding) daarvoor gebruikt moet worden (bijvoorbeeld: arrow.gif)
IndicateChildImage - afbeelding om te gebruiken voor hoofdmenuitems (bijvoorbeeld: arrow.gif)
IndicateChildImageExpandedSub - afbeelding die wordt gebruikt bij submenuitems wanneer onderliggende items zijn uitgeklapt
IndicateChildImageExpandedRoot - afbeelding die wordt gebruikt bij hoofdmenuitems wanneer onderliggende items zijn uitgeklapt
Paden
PathImage - Map voor de icoontjes
PathSystemImage - Map om de afbeeldingen van het control te kunnen vinden (bijvoorbeeld: spacer.gif)
PathSystemScript - Map om de script-bestanden van het control te kunnen vinden
Het stylesheet gebruikt de volgende klassen bij de DNNMenuNavigationProvider:
.root - Rootmenuitem
.m - Alle submenuitems (containers) krijgen deze klasse (standaard is dit een tabel)
.m[x] - Bijvoorbeeld '.m2'; Alle submenuitems op niveau x (2 in dit voorbeeld)
.mi - Menuitem
.id[x] - Bijvoorbeeld .id38; Menuitem waar de pagina het tabid 'x' heeft (38 in dit voorbeeld)
.mi[x][-x] - Bijvoorbeeld .mi0 .mi1-1; Hier is x de volgorde van het item tussen zijn overige items. .mi0-1 is dan het tweede subitem van de 'home-pagina'
.first - Eerste item in een lijst met subitems
.last - Laatste item in een lijst met subitems
.firstlast - Een item zonder andere submenuitems
.icn - Een icon op een pagina
.sel - Deze klasse wordt gebruikt wanneer de huidige pagina geselecteerd is
.bc - Alle actieve pagina's in het huidige kruimelpad krijgen deze klasse. Zij zijn de 'ouders' van de huidige pagina (bovenliggende pagina)
.hov - Een item krijgt deze klasse wanneer je er met de muis overheen gaat (door gebruik van JavaScript, geen CSS)