PANVEGA’s Blog

DotNet Development, SharePoint Customizing, Silverlight, MS Infrastructure and other tips and tricks

Customize the SharePoint Navigation Quick Launch

Posted by PANVEGA on April 18, 2008

You can modify the display of Quick Launch Naviagtion in SharePoint by modifying attributes of the navigation control specified in the default.master file. You can display a collapsed view with fly-out menus by creating a custom .master file or using the SharePoint object model. You can also create a custom .master file and use the Windows SharePoint Services object model to point a site to the new file.

The default.master file is the Windows SharePoint Services master page that contains templates for site page layout, including the template for the left navigational area used in SharePoint pages.

You find the master pages under your server /_calatlogs/masterpage or Local_Drive:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\12\TEMPLATE\GLOBAL. You can use e.g. the SP Designer to edit remotely your master page on your IIS. There you find the tag SharePoint:AspMenu and PublishingNavigation:PortalSiteMapDataSource with some usefull attributes to customize the Navigation as you wishes. YOu have to try a little bit to get a feeling how to combine diferent attributes together.

<asp:AspMenu id=”QuickLaunchMenu” DataSourceId=”QuickLaunchSiteMap” runat=”server” Orientation=”Vertical” StaticDisplayLevels=”1″ ItemWrap=”true” MaximumDynamicDisplayLevels=”1″ StaticSubMenuIndent=”0″ SkipLinkText=””>

DataSourceID Specifies the data source control that provides the hierarchical data for this menu. In the previous example code, the DataSourceID points to a control with the ID “GlobalNavDataSource”.
Orientation Specifies whether the menu is horizontal or vertical. In the previous example code, the orientation is horizontal.
StaticDisplayLevels Specifies the number of hierarchy levels to show in the menu at the same time.In this example, “1” is specified, indicating that the menu displays one level of hierarchy below the top-level site.
MaximumDynamicDisplayLevels Specifies the number of levels to show in dynamic fly-out menus.In this example, “1” is specified, indicating that the menu item on the first level of the site hierarchy with child sites or pages displays those sites or pages in fly-out menus.

<PublishingNavigation:PortalSiteMapDataSource ID=”SiteMapDS” Runat=”server” SiteMapProvider=”CurrentNavSiteMapProvider” EnableViewState=”true” StartFromCurrentNode=”true” StartingNodeOffset=”0″ ShowStartingNode=”false” TrimNonCurrentTypes=”Heading”/>

ShowStartingNode Affects whether the starting node is returned by the data source.When this property is set to true, the data source returns the starting node. The menu receives the starting node, which can be the root node, and items below the starting node.

When this property is set to false, the data source does not return the starting node. The menu receives only the items below the starting node.

StartFromCurrentNode Affects where the data source starts. That is, this property sets which section of the overall site hierarchy the data source control returns to the menu.When this property is set to true, Office SharePoint Server 2007 instructs the PortalSiteMapDataSource object to apply its rules for determining where it should be starting.
StartingNodeOffset Gets or sets a positive or negative integer offset from the starting node that determines the top-level site hierarchy that is exposed by the DataSourceControl object.The default is 0, which indicates that the top-level site hierarchy exposed by the SiteMapDataSource object is the same as the starting node.

The effect of this property is variable, undefined, and depends on site hierarchy details that are out of scope for this topic.

TrimNonCurrentTypes Allows context-based and type-based node trimming.In this example, TrimNonCurrentTypes=”Heading”, which instructs the data source to remove any nodes of type Heading that are not directly below the current node.

You can specify multiple values for this property in a comma-delimited list. Available values are defined in the NodeTypes enumeration.

TrimNonAncestorTypes Trims any specified types that are not directly below the current site or one of its ancestors.
TrimNonAncestorDescendantTypes Trims any nodes of specified types that are not below the current site or one of its ancestor or descendant sites.
TreatStartingNodeAsCurrent Affects which node is treated as the current node for trimming purposes. By default, current node refers to the node representing the item that is currently being visited.When TreatStartingNodeAsCurrent is set to true, the starting node of the data source is treated as the context or trimming node.

SomeExamples:

First open the default.master file in an editor and search for “MaximumDynamicDisplayLevels”. Once you find the MaximumDynamicDisplayLevels property of the <SharePoint:AspMenu> element change the number to the requested number of levels. For example to get 3 sub menu item levels to be displayed in the Top Navigation Bar simply change the number to 3.

MaximumDynamicDisplayLevels=”3″

Once you’ve made the change save and close the file. After saving your changes you should refresh your page and see that more levels are displayed on your SharePoint Top Navigation Bar. The below image shows the Top Navigation Bar when the MaximumDynamicDisplayLevels is set to 3.

You can display multiple menu levels in the static menu by setting the StaticDisplayLevels property to a value greater than 1. You can also display additional levels in dynamic menus by setting this property to a value greater than 0. For example, if you display two menu levels in the static menu (by setting the StaticDisplayLevels property to 2) and then set this property to 3, three additional menu levels are displayed in dynamic menus. All remaining higher menu levels (if any) are discarded.

Setting this property to 0 displays a flat menu up to the level specified by the StaticDisplayLevels property, without any dynamic menus.

To control dynamic display behavior, use this property to specify how many additional menu levels should dynamically appear after the static display level. For example, if the menu has a static level of 3 and a max dynamic level of 2, the first three levels of the menu would be statically displayed, while the next two levels would show dynamically.

The following example demonstrates how to use the MaximumDynamicDisplayLevels property to limit the number of menu levels to display in a dynamic menu.

<asp:menu id = “navigationMenu” staticdisplaylevels=2 staticsubmenuindent=10 orientation = “Vertical” maximumdynamicdisplaylevels=3 target = “_blank” runat = “server”></asp:menu>

More Sources:

http://msdn.microsoft.com/en-us/library/ms558975.aspx

Advertisements

8 Responses to “Customize the SharePoint Navigation Quick Launch”

  1. Lance Chung said

    Thank you very much,waiting this answer for a long time.

  2. hhh said

    how to dynamically add when page is loaded…?

  3. PANVEGA said

    I don´t really know what you exactly want.
    But by changing the MaximumDynamicDisplayLevels=”1″ greater than 0 creates a fly-out menu with the e.g. 1 Level child site right next to the navigation. Hope that helps.

  4. […] https://panvega.wordpress.com/2008/04/18/customize-the-sharepoint-navigation-aspmenu […]

  5. […] https://panvega.wordpress.com/2008/04/18/customize-the-sharepoint-navigation-aspmenu […]

  6. Steve said

    One thing to mention is that of course you can’t manage more than 2 levels in the quick launch section of site settings, so if you’re handing this over to users then they can only maintain a 2 level menu.

    • Togotooner said

      One thing to mention is that of course you can’t manage more than 2 levels in the quick launch section of site settings, so if you’re handing this over to users then they can only maintain a 2 level menu.

      So this means I can’t edit this to extend out beyond 2 levels? I’m an Admin level user,…how can I make the Quick Launch extend out further?

  7. Woody said

    Any ideas how to specify the starting node?

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

 
%d bloggers like this: