Navigation : Sub-levels

In this tutorial we will see that it is possible to increase the number of sub-levels displayed in navigation, whether at the global navigation, or at the quick navigation.

To illustrate this example, create a site like Team Site. In this site, create a new one and so on for a tree of 5 levels. The first site we will activate the publishing feature that will allow us to have a global view of the tree.

Once the sites created, we have a tree that looks like this:

At each site, go to the navigation menu and check show subsites.

Let us return to our site “Tuto” and look what it’s like in the global navigation.

As we see, only the first sublevel appears statically, if we move the mouse over the “Sub-Site 1” of the global navigation, we see the second sublevel and if we move the mouse on “sub-sub site-“the title is just highlighted.

In fact the number of subsites displayed just one parameter of navigation. We’ll go see the definition of navigation components that are in the masterpage.

For this, we will open the site “Tuto” through SharePoint Designer.

We will start by making a copy of the default.master we’ll call “Tuto.master”

Once the new master page added, we must approve it in the masterpage catalog of our application.

Once it is approved, it becomes available in the choice of the masterpage of the site, thus apply our new masterpage and back to SharePoint Designer

We must now extract the file before editing.

Do a search on “ID =” TopNavigationMenu “” to fall on the definition of the global navigation. We arrive on a block like this:

<SharePoint: AspMenu ID = "TopNavigationMenu" runat = "server" DataSourceID = "topSiteMap" EnableViewState = "false" AccessKey = "<% $ Resources: wss, navigation_accesskey%>" Orientation = "Horizontal" StaticDisplayLevels = "2" = MaximumDynamicDisplayLevels "1" DynamicHorizontalOffset = "0" StaticPopoutImageUrl = "/ _layouts / images / menudark.gif" StaticPopoutImageTextFormatString = "" DynamicHoverStyle-BackColor = "# CBE3F0" SkipLinkText = "" StaticSubMenuIndent = "0" CssClass = "ms-topNavContainer">

In this definition, we are interested in two parameters, namely StaticDisplayLevels and MaximumDynamicDisplayLevels

StaticDisplayLevels: Expects an integer greater than 0 as a parameter and indicates how many sublevels should be displayed statically. Modify the field value by replacing the “2” initial by “4”.

As we can see, we now have the first 4 levels that are displayed in the navigation. Let’s put the value “2” before proceeding to the second parameter.

MaximumDynamicDisplayLevels expects an integer greater than or equal to 0 as a parameter and indicates how many sublevels should be displayed dynamically. Modify the field value by replacing the “1” initial by “2”.

As we see, a sublevel was added to the signage. If now we change the field value by replacing the “2” to “3”. We will still see a sublevel extra.

So much for global navigation, now see the quick navigation that is almost identical.

Do a search on “id =” QuickLaunchMenu “” to fall on the definition of quick navigation.We arrive on a block like this.

<SharePoint:AspMenu Id="QuickLaunchMenu" DataSourceId="QuickLaunchSiteMap" runat="server" Orientation="Vertical" StaticDisplayLevels="2" ItemWrap="true" MaximumDynamicDisplayLevels="0" StaticSubMenuIndent="0" SkipLinkText="">

As we see, our two parameters are always present, the only difference being that the default value of MaximumDynamicDisplayLevels is 0.

At the moment our view is similar to that.

For example, we will put the value of MaximumDynamicDisplayLevels to 4. See the result:

Voila, we now increase the number of levels displayed no development.


Article originally posted on 05/05/2010 on Areaprog


One thought on “Navigation : Sub-levels

Leave a Reply

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

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

Google+ photo

You are commenting using your Google+ 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 )


Connecting to %s