Introduction:
In this article I will explain how to use sitemappath navigation control or create breadcrumb for web application with example in asp.net.
In this article I will explain how to use sitemappath navigation control or create breadcrumb for web application with example in asp.net.
Description:
In previous post I explained and many articles relating to asp.net, JQuery, Ajax etc. Now I will explain how to use sitemap navigation control or how to implement breadcrumb in asp.net.
Sitemap navigation is a control which allows users to know the current page location with respect to home page. To implement this concept
First create one new web application >> Right click on application and select Add New Item >> Select Web Form >> Give name as Careers.aspx >> Click OK
Similar way you can add two more pages and give names as Jobs.aspx and ContactUs.aspx page
Once pages added to website >> Right click on website and select Add New Item >> Select SiteMap >> Click OK
Once SiteMAP added to website open SiteMAP and write the following code
| <?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="Careers.aspx" title="Careers" description="Careers Page" > <siteMapNode url="Jobs.aspx" title="Jobs" description="Jobs Page" /> </siteMapNode> <siteMapNode url="ContactUs.aspx" title="Contact" description="ContacUs Page" /> </siteMapNode> </siteMap> |
If you observe above sitemap I added Career.aspx page and ContactUs.aspx pages under Default.aspx page and I added Jobs.aspx under Career.aspx page.
Now if we open Jobs.aspx page we will get sitemap like this
Home >> Careers >> Jobs
For example if we open ContactUs.aspx page we will get sitemap like this
Home >> Contact
Now write the following code in all aspx pages (Default.aspx, Career.aspx, Jobs.aspx and ContactUs.aspx)
| <html xmlns="http://www.w3.org/1999/xhtml"> <head id="Head1" runat="server"> <title>Site Navigation or BreadCrumb Example in asp.net</title> </head> <body> <form id="form1" runat="server"> <div> <asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" /> <asp:SiteMapPath ID="SiteMap1" runat="server"></asp:SiteMapPath> </div> </form> </body> </html> |
After completion of add above code in all pages open Jobs.aspx and run you will find site navigation like this
If you open ContactUs.aspx page you will find site navigation output like this
SHARE THIS POST
0 comments :
Post a Comment