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 how to pass table as parameter to stored procedure, Add Fade in effect to webpage using JQuery 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
 |
Download Sample Code Attached
|
If you enjoyed this post, please support the blog below. It's FREE! Get the latest Asp.net, C#.net, VB.NET, jQuery, Plugins & Code Snippets for FREE by subscribing to our Facebook, Twitter, RSS feed, or by email. |
|||
Subscribe by RSS
Subscribe by Email
|
|||
21 comments :
Nice one!!!
+
To stop showing the root node add this in sitemappath --> ShowStartingNode="False"
easy way learning of the asp.net
Hi,
Great article.
Thanx..
But how to implement category ,sub category in e-commerce application
Is it possible to create a horizontal menu using the below sitemap file? The menu should display.....
home menu1 menu2 menu3 menu4>menusub1 etc.......
The problem with the current sitemap is that everything is under the top "Home" node. and i also set orientation=horizontal but still not getting.....i know this problem is nothing but annoying me....please help
Is it possible to create a horizontal menu using the below sitemap file? The menu should display.....
home menu1 menu2 menu3 menu4>menusub1 etc.......
?xml version="1.0" encoding="utf-8" ?>
The problem with the current sitemap is that everything is under the top "Home" node. and i also set orientation=horizontal but still not getting.....i know this problem is nothing but annoying me....please help
Is it possible to create a horizontal menu using the below sitemap file? The menu should display.....
home menu1 menu2 menu3 menu4>menusub1 etc....
The problem with the current sitemap is that everything is under the top "Home" node. and i also set orientation=horizontal but still not getting.....i know this problem is nothing but annoying me....please help
thanks
grt work dude
and thanxs 4 ur articles it solved my work and ca i ask u questions about programmes of .net and can u solve and give it to my mail id plz
Hi,
i want asp.net(C#) breadcrumbs code in visualstudio2008 without addiong sitemap...can anyone help in this issue asap...
thnaks in advance
Hi,
I created a web forms application in visual studio 2013.
Added a webform Test.aspx under the root.
Added sitemap and datasource.
Added sitemap as follows
when I browse Test.aspx breadcrumb is not displayed. Whats the problem? Kindly help me...
Hi,
I just found that in the .Net 3.5 web app created using vs 2008 it works but not in .net framework 4.5 web app created using vs 2013.
Please add following code in web.config if you getting issues using sitemap in code, it might be reading Machine.config setting in this case, which you need to override
Override the machine congig XmlSitemapprovide in web.config file
simple to follow
Hi,
I have a doubt
1)in footer page their is links for that i need to create the site map in asp.net core1.0 project.pls give me an idea and share the flow to create that
thanks in advance
Hi,
In this example the pages are in the same directory.
In my website there are multiple folders containing multiple pages.
Now at run time the server throws error like page not found.
What is the solution for this?
Thank you.
thanks alot
Note: Only a member of this blog may post a comment.