DotNet Tutorials

V4 Dot Net Tutorials

Server Intellect Cloud Hosting

Navigator : Home > Tutorials > Website Navigation Tutorials > ...

 Building Site Navigation Menu using ASP.NET 2.0 and VB

This tutorial will show you how to use SiteMapPath with the Menu control to build up site navigation menu by using ASP.NET 2.0 and VB.NET.

The controls of Menu, SiteMapPath and SiteMapDataSource can generate navigation UI based on navigation data. This data can be stored in XML files, or it can be stored using the provider-based storage capabilities of the Site Navigation feature. This samples demonstrate using the different controls in conjunction with the Site Navigation feature.

At first, you will need to create a file Web.sitemap. The code is as follows:

<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
<siteMapNode title="Home" url="~/SiteMapPathTreeViewCsharp.aspx" description="Home Page" >
<siteMapNode title="Section One" url="~/sectionone.aspx" description="Section One">
<siteMapNode title="First Page" url="~/sectionone/firstpage.aspx" description="Section One - First Page"/>
<siteMapNode title="Second Page" url="~/sectionone/secondpage.aspx" description="Section One - Second Page"/>
</siteMapNode>
<siteMapNode title="Section Two" url="~/sectiontwo.aspx" description="Section Two">
<siteMapNode title="First Page" url="~/sectiontwo/firstpage.aspx" description="Section Two - First Page"/>
<siteMapNode title="Second Page" url="~/sectiontwo/secondpage.aspx" description="Section Two - Second Page"/>
</siteMapNode>
</siteMapNode>
</siteMap>

We are using Server Intellect and have found that by far, they are the most friendly, responsive, and knowledgeable support team we've ever dealt with!

Secondly, please build a MasterPage file Site.master. The code is as followw:

<table cellspacing="0" cellpadding="5" border="0" height="80%">
<tr>
<td style="width: 100px" valign="top">
<asp:treeview ID="TreeView1" ForeColor="White" DataSourceId="SiteMapDataSource1" NodeIndent="0" NodeStyle-ChildNodesPadding="10" runat="server">
<LevelStyles>
<asp:TreeNodeStyle Font-Bold="true"/>
<asp:TreeNodeStyle />
<asp:TreeNodeStyle Font-Size="x-small"/>
</LevelStyles>
<nodestyle forecolor="White" HorizontalPadding="5"/>
<SelectedNodeStyle backcolor="lightblue" forecolor="blue" />
<HoverNodeStyle Font-UnderLine="true" />
</asp:treeview>
</td>
<td style="background-color: white;padding-left:25;padding-top:15" colspan="2" valign="top">
<b>Current Page: </b>
<asp:sitemappath id="SiteMapPath1" runat="server" />
&nbsp;<br/>
<br />
<asp:contentplaceholder id="MainBody" runat="server" />
</td>
</tr>
</table>
<asp:sitemapdatasource id="SiteMapDataSource1" runat="server" />

The front end SiteMapPathMenuNavigationVB.aspx page looks something like this:

<%@ Page Language="VB" MasterPageFile="~/Site.master"%>

<asp:Content ID="Content1" ContentPlaceHolderID="MainBody" Runat="Server">
This is the home page
</asp:Content>



Server Intellect offers Windows Hosting Dedicated Servers at affordable prices. I'm very pleased!



Looking for the C#.NET 2005 Version? Click Here!

Looking for more ASP.NET Tutorials? Click Here!
Download Project Source - Enter your Email to be emailed a link to download the Full Source Project used in this Tutorial!



100% SPAM FREE! We will never sell or rent your email address!