How to use SiteMapPath Navigation Control in - ASPMANTRA | Asp.Net,MVC,AngularJs,Jquery,Javascript,Sql Server AND WCF snippets and tutorial

How to use SiteMapPath Navigation Control in

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


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="" >
    <siteMapNode url="" title=""  description="">
        <siteMapNode url="" title=""  description="" />
        <siteMapNode url="" title=""  description="" />

Enter the .aspx page name in URL, Title and Description as shown in below example:
<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="" >
    <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 url="Contact_Us.aspx" title="Contact Us"  description="Contact Us Page" />

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" />

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.

What do you think about this article?

If you found this article useful, please share and follow on Facebook, Twitter, Google Plus and other social media websites. To get free updates subscribe to newsletter. Please put your thoughts and feedback in comments section.