This article explains how to do site navigation for your web site
Introduction
Asp.net 2.0 has cool control for site navigation is SiteMapPath control.You can find SiteMapPath control in the Toolbox under the Navigation category.Using this control you can find where are you in this website.
First Add Web.sitemap in your project.Web.Sitemap has Title,Url and description attributes.like this,
Site Map Properties
<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
<siteMapNode url="~/Default.aspx" title="Home" description="Home">
<siteMapNode url="~/InsideUs.aspx" title="Inside Us" description="">
<siteMapNode url="~/VisionMission.aspx" title="Vision & Mission" description=""/>
<siteMapNode url="~/Culture.aspx" title="Culture" description=""/>
<siteMapNode url="~/Trust.aspx" title="Trust" description=""/>
<siteMapNode url="~/BusinessPriciples.aspx" title="Business Principles" description=""/>
</siteMapNode>
<siteMapNode url="~/contactus.aspx" title="Contact US" description="Contact US"/>
<siteMapNode url="~/aboutus.aspx" title="About Us" description="About Us"/>
</siteMapNode>
</siteMap>
Master Page for the application
Now add the master page in your project and then drag and drop the SiteMapPath control.like this,
<asp:SiteMapPath ID="SiteMapPath1" runat="server" Font-Names="Verdana" Font-Size="0.8em" PathSeparator=" : ">
<PathSeparatorStyle Font-Bold="True" ForeColor="#5D7B9D" />
<CurrentNodeStyle ForeColor="#333333" />
<NodeStyle Font-Bold="True" ForeColor="#7C6F57" />
<RootNodeStyle Font-Bold="True" ForeColor="#5D7B9D" />
</asp:SiteMapPath>
The SiteMapPath control will automatically bind itself to the Web.sitemap file.If you use default SiteMap provider will
automatically be used by SiteMapPath control and also you can set the SiteMapProvider property of SiteMapPath control.
Now when you are on Culture.aspx page then SiteMapPath control display like, Home : Inside Us : Culture
So you can easily go from "Culture" page to "Home" page or "Inside Us" page (root node) using SiteMapPath Control.
Here,I set PathSeparator property of SiteMapPath control to : by default is >.
PathDirection property use for in which direction you want to display link.CurrentToRoot display link start from current node to Parent node like Culture : Inside Us : Home.And other is RootToCurrent display link start from Parent node to Current node like Home : Inside Us : Culture.
|
| Author: Mahesh Raj 07 Jun 2008 | Member Level: Gold Points : 1 |
This is very good information,Continue posting such useful articles.
|
| Author: John Fernandez 08 Jun 2008 | Member Level: Gold Points : 1 |
Very well written Article.Thanks for sharing this information.
|
| Author: Preet 31 Oct 2008 | Member Level: Gold Points : 1 |
Thats a gr8 article defined in very easy to understand
and interesting way.
Many Thanks
Keep it up
|