SiteMapPath Example in ASP.NET using C#

In this article we will introduce with SiteMapPath control in ASP.NET using C#.

SiteMapPath Example in ASP.NET using C#

SiteMapPath control in ASP.NET is used to show the hierarchical path of the Navigation. When user clicks on the link and it will navigate on other page and it shows the path of links. It will possible through only SiteMapPath. You can bind data with this control by using SiteMapDataSource. In this example the main page will not shows the path of link. When you click a TreeViewItem the page will navigate on related page this page will shown the path of Navigation link.
The following image shows the SiteMapPath.

The syntax of SiteMapPath is following:

<asp:SiteMapPath ID="SiteMapPath1" runat="server">
</asp:SiteMapPath>

SiteMapPath.aspx (Design Page):

SiteMapPath.aspx (source code):

<%@ Page Title="" Language="C#" MasterPageFile="~/RoseindiaMaster.master" AutoEventWireup="true"
CodeFile="SiteMapPath.aspx.cs" Inherits="SiteMapPath" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="Server">
<div>
<h2 style="color: Green">
SiteMapPath in ASP.NET 4, C#</h2>
<asp:TreeView ID="TreeView1" runat="server" ImageSet="Simple" DataSourceID="SiteMapDataSource1">
<HoverNodeStyle Font-Underline="True" ForeColor="#5555DD" />
<NodeStyle Font-Names="Tahoma" Font-Size="10pt" ForeColor="Black" HorizontalPadding="0px"
NodeSpacing="0px" VerticalPadding="0px" />
<ParentNodeStyle Font-Bold="False" ImageUrl="~/Images/bullet-red.png" />
<RootNodeStyle ImageUrl="~/Images/bullet.png" />
<SelectedNodeStyle Font-Underline="True" ForeColor="#5555DD" HorizontalPadding="0px"
VerticalPadding="0px" />
</asp:TreeView>
&nbsp;&nbsp;&nbsp;
<asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />
<br />
</div>
</asp:Content>

Web.sitemap file:

<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
<siteMapNode url="http://www.devmanuals.com/" title="ASP.NET" description="ASP.NET Tutorials">
<siteMapNode url="http://www.devmanuals.com/tutorials/ms/aspdotnet/index.html" title="Controls" description="Standards Controls">
<siteMapNode url="~/TextBox.aspx" title="TextBox" description="TextBox Control"/>
<siteMapNode url="~/BulletList.aspx" title="BulletList" description="BulletList Control"/>
<siteMapNode url="~/Image.aspx" title="Image" description="Image Control"/>
<siteMapNode url="~/ImageMap.aspx" title="ImageMap" description="ImageMap Control"/>
</siteMapNode>
<siteMapNode url="http://www.devmanuals.com/tutorials/ms/aspdotnet/requiredfieldvalidator.html" title="Validator" description="Validation Controls">
<siteMapNode url="~/RequiredFieldValidator.aspx" title="RequiredFieldValidator" description="RequiredFieldValidator"/>
<siteMapNode url="~/CompareValidator.aspx" title="CompareValidator" description="CompareValidator"/>
<siteMapNode url="~/RangeValidator.aspx" title="RangeValidator" description="RangeValidator"/>
<siteMapNode url="~/RegularExpressionValidator.aspx" title="RegularExpressionValidator" description="RegularExpressionValidator"/>
<siteMapNode url="~/CustomValidator.aspx" title="CustomValidator" description="CustomValidator"/>
<siteMapNode url="~/ValidationSummary.aspx" title="ValidationSummary" description="ValidationSummary"/>
</siteMapNode>
</siteMapNode>
</siteMap>

Output:

Suppose user clicks on BulletList then the page will show the SiteMapPath. You can see the following figure.