How to use SiteMapPath Navigation Control in Asp.net

Introduction: In this article I have explain How to use SiteMapPath Navigation Control in Asp.net

Description:

In the last article I have explained Auto refresh data in Gridview without loading page whole page in asp.net, Validate DropDownlist using Jquery in asp.net, Encrypt and Decrypt Query String in asp.net, Create multiple Language website in Asp.net and Store Password in Encrypted format to Database in asp.net.

Right click on Project/Website name > Add New Item > Select Site Map as mention in attached snapshot: 

You see the structure as show below:

<?xml version="1.0" encoding="utf-8" ?>

<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >

    <siteMapNode url="" title=""  description="">

        <siteMapNode url="" title=""  description="" />

        <siteMapNode url="" title=""  description="" />

    </siteMapNode>

</siteMap>

Enter the .aspx page name in URL, Title and Description as shown in below example:

<?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 Page">

        <siteMapNode url="About_Us.aspx" title="About Us"  description="Aount Us Page" />

      <!--For Sub menu (Here Photo Gallery is Sub menu of Achievement Menu)-->

      <siteMapNode url="Achievements.aspx" title="Achievement" description="Achievements Page">

        <siteMapNode url="Photo_Gallery.aspx" title="Photo Gallery" description="Photo Gallery Page"/>

      </siteMapNode>

        <siteMapNode url="Contact_Us.aspx" title="Contact Us"  description="Contact Us Page" />

    </siteMapNode>

</siteMap>

Add a new webform to project. Drag and drop the control SiteMapPath from Toolbox> Navigation as show in attached snapshot:

After that you can change the formating of SiteMapPath via click on Auto Foramt, choose your style or can add the CssClass in Properties. 

  <asp:SiteMapPath ID="SiteMapPath1" runat="server" Font-Names="Verdana"

            Font-Size="0.8em" PathSeparator=" : ">

        <CurrentNodeStyle ForeColor="#333333" />

        <NodeStyle Font-Bold="True" ForeColor="#7C6F57" />

        <PathSeparatorStyle Font-Bold="True" ForeColor="#5D7B9D" />

        <RootNodeStyle Font-Bold="True" ForeColor="#5D7B9D" />

        </asp:SiteMapPath>

Run the project and check the result.

Is it helpful?

If yes post your comment to admire my work. You can like me on Facebook, Google+, Linkedin and Twitter via hit on Follow us Button and also can get update follow by Email.