Use iamge as path separator in asp.net SiteMapPath

Iamge as path separator in SiteMapPath

SiteMapPath is an asp.net web server control. sitemappath control's PathSeparatorTemplate property get or set a control template to use for the path delimiter of a site navigation path. in this path separator template section we can put image control to display it as a path separator of navigation path.

after putting the image control inside path separator template area it will display in web browser as sitemappath control's path delimiter. PathSeparatorTemplate overrides both the PathSeparatorText and PathSeparatorStyle property.

the following asp.net c# example code demonstrate us how can we display an image as sitemappath control's path separator in an asp.net application.

ButtonExample.aspx


<%@ Page Language="C#" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script runat="server">
    
</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>How to use iamge as path separator in SiteMapPath</title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <h2 style="color:Navy">SiteMapPath Example: Image Path Separator</h2>
        <asp:SiteMapPath 
             ID="SiteMapPath1" 
             runat="server"
             ForeColor="SeaGreen"
             Font-Size="Large"
             Font-Bold="true"
             BorderWidth="1"
             BorderColor="LawnGreen"
             BackColor="Snow"
             >
             <PathSeparatorTemplate>
                <asp:Image runat="server" ID="Image1" ImageUrl="~/Images/PathSeparator.gif" />
             </PathSeparatorTemplate>
             <NodeStyle ForeColor="SeaGreen" />
        </asp:SiteMapPath>
    </div>
    </form>
</body>
</html>

Web.sitemap

Web.sitemap source code here.

Related asp.net examples