Introduction
ASP.NET is an excellent web application framework that you can use to create dynamic websites and web applications. You can use ASP.NET to manage your links and create a consistent way for your users to browse through your website.
Websites always need to display navigation data to guide users through a site.
In this how-to article, we will show you how to create a site navigation hierarchy using ASP.NET.
How To Create A Site Navigation Hierarchy With ASP.NET
ASP.NET Site Navigation
You can manage your site by using the ASP.NET site navigation; its features include;
- Sitemaps – These ‘maps’ are used to describe how your site looks like or in other words, the structure of your site. As your site grows, you can modify the sitemaps and add or remove pages. This is helpful since you won’t need to modify hyperlinks for all your WebPages.
- ASP.NET Controls – The controls come in handy whenever you want to display navigation menus for your site.
- Site Navigation
Using site navigation, you describe the structure of your site as a hierarchy. You start by defining the hierarchy of your website in an XML file. You can choose to use the SiteMapPath, TreeView or Dynamic Menu control to display a navigation path (also called a breadcrumb or eyebrow). The breadcrumb shows the current page and also displays links as a path that leads back to the homepage.
Rules For Creating A Sitemap File
The XML file should have a <sitemap> tag surrounding the content.
The <sitemap> tag should only have one child node (<siteMapNode>) in the homepage section.Each node (<siteMapNode>) can have several child nodes or web pages.Each node should have attributes defining the web page title and the URL.
For example, a SiteMapPath may look something like the following;
Home > Services > Training
As for the TreeView control, it would display a tree-like structure which shows links to different pages on your site. It uses nodes which can be expanded or collapsed when clicked. An example of a TreeView structure is;
Home
– Services
+ Training
An example of its code is;
<asp:SiteMapDataSource id="nav1" runat="server" /> <form runat="server"> <asp:TreeView runat="server" DataSourceId="nav1" /> </form>
The <asp:SiteMapDataSource> connects to the Web.sitemap file.
Finally, the Dynamic Menu control shows an expandable menu that users can use to get to different areas in your site. Just, like the TreeView control it uses nodes, but in this case, when the cursor hovers over the menu item, the nodes are expanded. An example of a dynamic menu code is;
<asp:SiteMapDataSource id="nav1" runat="server" /> <form runat="server"> <asp:Menu runat="server" DataSourceId="nav1" /> </form>
The <asp:SiteMapDataSource> connects to the Web.sitemap file.
For you to use these controls, you must first describe your site’s structure in a web.sitemap file.
Creating A Web.sitemap File
In the root folder of your site, create a new file and call it Web.sitemap. Open the created file and add the following lines of code. You can substitute the default contents for your sites web pages.
<siteMap>
<siteMapNode title="Home" description="Home" url="~/home.aspx" >
<siteMapNode title="Products" description="Our products"
url="~/Products.aspx">
<siteMapNode title="Hardware"
description="Hardware we offer"
url="~/Hardware.aspx" />
<siteMapNode title="Software"
description="Software for sale"
url="~/Software.aspx" />
</siteMapNode>
<siteMapNode title="Services" description="Services we offer"
url="~/Services.aspx">
<siteMapNode title="Training" description="Training"
url="~/Training.aspx" />
<siteMapNode title="Consulting" description="Consulting"
url="~/Consulting.aspx" />
<siteMapNode title="Support" description="Support"
url="~/Support.aspx" />
</siteMapNode>
</siteMapNode>
</siteMap>Save the file and then close it. The above file contains siteMapNode elements nested into three levels.
Conclusion
In this article, we have managed to create a sitemap for our site and demonstrated how to create site navigation using ASP.NET controls. You can customize the code to suit your site navigation.
Check out these top 3 Windows hosting services:
- Click this link and all your queries to best hosting will end.
