Customizing the Navigation Areas

  • Article

This programming task shows how to customize the top navigation area that is displayed on every page within a SharePoint site and the Quick Launch area that is displayed on home pages. The first example involves modifying the ONET.XML file of the site definition, while the second example involves modifying both ONET.XML and default.aspx.

Warning  It is required that you create a custom site definition by copying an existing site definition, rather than modifying the original ONET.XML file installed with Windows SharePoint Services. Changes that you make to the originally installed file may be overwritten when you install updates or service packs for Windows SharePoint Services, or when you upgrade an installation to the next product version. For information on creating a custom site definition, see Creating a Site Definition from an Existing Definition. Modifying an originally installed ONET.XML file to customize the navigation areas of pages in already existing sites is not supported.

The NavBars element near the beginning of ONET.XML contains several NavBar elements, the first of which pertains to the top navigation area and is named SharePoint Top Navbar. All other NavBar elements contained within the NavBars element define the Quick Launch area of the home page.

To customize the top navigation area

Customize the top navigation area of future sites created through the site definition by adding a NavBarLink element to the first NavBar element within ONET.XML (in Local_Drive:\Microsoft Shared\Web Server Extensions\60\TEMPLATE\Locale_ID\SITE_DEFINITION\XML). You can add links to local files and pages within the Microsoft Windows SharePoint Services deployment or links to files and pages located elsewhere.

The following example adds two NavBarLink elements, one that provides a link to a local file called Sample.aspx on the server, and another that provides a link to an external URL, http://example.microsoft.com.

<NavBars>
   <NavBar Name="SharePoint Top Navbar" ID="1002">
      <NavBarLink Name="Documents and Lists"
         Url="_layouts/[%=System.Threading.Thread.CurrentThread.CurrentCulture.LCID%]/viewlsts.aspx">
      </NavBarLink>
      <NavBarLink Name="Create"
         Url="_layouts/[%=System.Threading.Thread.CurrentThread.CurrentCulture.LCID%]/create.aspx">
      </NavBarLink>
      <NavBarLink Name="Site Settings"
         Url="_layouts/[%=System.Threading.Thread.CurrentThread.CurrentCulture.LCID%]/settings.aspx">
      </NavBarLink>
      <NavBarLink Name="Get Current Data" Url="_layouts/Sample.aspx"></NavBarLink>
      <NavBarLink Name="microsoft" Url="http://example.microsoft.com/"></NavBarLink>
      <NavBarLink Name="Help" Url="javascript:HelpWindow()"></NavBarLink>
   </NavBar>
   <NavBar Name="Documents" ID="1004">
   .
   .
   .
   </NavBar>
   <NavBar Name="Pictures" ID="1005">
   .
   .
   .
   </NavBar>
   <NavBar Name="Lists" ID="1003">
   .
   .
   .
   </NavBar>
   <NavBar Name="Discussions" ID="1006">
   .
   .
   .
   </NavBar>
   <NavBar Name="Surveys" ID="1007">
   .
   .
   .
   </NavBar>
</NavBars>

The value of the Url attribute in the local link is relative to the top-level SharePoint site.

To customize the Quick Launch area

Just as for the top navigation area, you can add NavBarLink elements to any of the existing NavBar elements to customize the Quick Launch area.

The following example adds two links for existing lists on other sites to the Lists navigation bar. Both links appear beneath the Lists heading on home pages.

<NavBar Name="Lists" Prefix="&lt;table border=0 cellpadding=4 cellspacing=0&gt;"
   Body="&lt;tr&gt;&lt;td&gt;&lt;table border=0 cellpadding=0
   cellspacing=0&gt;&lt;tr&gt;&lt;td&gt;&lt;img src='/_layouts/images/blank.gif' ID='100'
   alt='Icon' border=0&gt;&amp;nbsp;&lt;/td&gt;&lt;td valign=top&gt;&lt;a
   ID=onetleftnavbar#LABEL_ID# href='#URL#'&gt;#LABEL#&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;&lt;/td&gt;&lt;/tr&gt;"
   Suffix="&lt;/table&gt;" ID="1003">
      <NavBarLink Name="List_1" Url="/Site1_Name/Lists/List1_Name/AllItems.aspx"/>
      <NavBarLink Name="List_2" Url="/Site2_Name/Lists/List2_Name/AllItems.aspx"/>
</NavBar>

You can also define a new navigation bar for display in the Quick Launch area of home pages, which involves modifying both ONET.XML and default.aspx of a site definition.

In ONET.XML, copy one of the existing NavBar elements to create a navigation bar, providing a unique name and ID as follows:

<NavBar Name="MyNewNavBar" Prefix="&lt;table border=0 cellpadding=4 cellspacing=0&gt;"
   Body="&lt;tr&gt;&lt;td&gt;&lt;table border=0 cellpadding=0 cellspacing=0&gt;&lt;tr&gt;&lt;td&gt;&lt;img
   src='/_layouts/images/blank.gif' ID='100' alt='Icon' border=0&gt;&amp;nbsp;&lt;/td&gt;&lt;td
   valign=top&gt;&lt;a ID=onetleftnavbar#LABEL_ID# href='#URL#'&gt;#LABEL#&lt;/td&gt;&lt;/tr&gt;&lt;/table&gt;&lt;/td&gt;&lt;/tr&gt;"
   Suffix="&lt;/table&gt;" ID="1009">
      <NavBarLink Name="List_1" Url="/Site1_Name/Lists/List1_Name/AllItems.aspx"/>
      <NavBarLink Name="List_2" Url="/Site2_Name/Lists/List2_Name/AllItems.aspx"/>
      <NavBarLink Name="List_3" Url="/Site3_Name/Lists/List3_Name/AllItems.aspx"/>
</NavBar>

Open default.aspx, which is located in the top folder of the site definition at Local_Drive:\Microsoft Shared\Web Server Extensions\60\TEMPLATE\1033\SITE_DEFINITION, and find the navigation section on the page, which is marked <!-- Navigation -->.

Add two table rows to the group of rows containing the different sections of the Quick Launch area. The following example inserts a new section, My New Navigation Bar, beneath the existing Surveys section. The first row contains the header and provides a link to a Web application, while the second row inserts the new navigation bar on the page by means of a Navigation control.

<TR><TD class="ms-navheader">
   <A HREF="_layouts/<%=System.Threading.Thread.CurrentThread.CurrentUICulture.LCID%>/viewlsts.aspx?BaseType=4">
      Surveys</A>
</TD></TR>
<TR><TD style="height: 6px"><!--webbot bot="Navigation" S-Btn-Nobr="FALSE" S-Type="sequence"
      S-Rendering="html" S-Orientation="Vertical" B-Include-Home="FALSE" B-Include-Up="FALSE"
      U-Page="sid:1007" S-Bar-Pfx="<table border=0 cellpadding=4 cellspacing=0>" S-Bar-Sfx="</table>"
      S-Btn-Nml="<tr><td><table border=0 cellpadding=0 cellspacing=0><tr><td>
      <img src='_layouts/images/blank.gif' ID='100' alt='Icon' border=0>&amp;nbsp;</td>
      <td valign=top><a ID=onetleftnavbar#LABEL_ID# href='#URL#'>#LABEL#</td></tr></table></td></tr>"
      S-Target TAG="BODY" startspan --><SharePoint:Navigation LinkBarId="1007" />
      <!--webbot bot="Navigation" endspan -->
</TD></TR>

<TR><TD class="ms-navheader"><A HREF="_layouts/Web_Application/webform1.aspx">My New Navigation Bar</A>
</TD></TR>
<TR><TD><SharePoint:Navigation LinkBarId="1009" />
</TD></TR>

For changes to become apparent, customizations described in this topic may require resetting Internet Information Services (IIS).