ASP.NET 2.0: A Developeramp;#039;s Notebook [Electronic resources] نسخه متنی

2.4. Create a Site Map for Your Web Site

Note: Your users will never be lost again if you create a site
map for your web site!

Unless your web site contains only a single web
page, you need a way for users to easily navigate between the pages
of your site. In ASP.NET 2.0, there are four new controls that make
it easy to implement site navigation. These controls are:

SiteMapDataSource

A control that represents a site map. A site map is an XML file
that describes the logical structure of a web site and the
relationship between its pages. The SiteMapDataSource control is not
visible on the page when it is loaded, but its role is to act as a
supplier of site information (taken from the site map file) to the
SiteMapPath control.

SiteMapPath

A visual control that depicts the path to the current page,
"bread crumb" style.

Menu

A visual control that displays information in menu
form. The Menu control supports data binding to a site map.

TreeView

A visual control that displays
information in a hierarchical structure. The TreeView control
supports data binding to a site map.

In the remaining labs in this chapter, you will learn how to use
these controls to make it easy for users to navigate your web site.
But first, let's take a closer look at the
SiteMapDataSource and SiteMapPath controls.

2.4.1. How do I do that?

In this lab, you'll see
how you
can use the SiteMapPath control together with the
Web.sitemap file to display navigation paths on
your site pages. First, you'll create a web
application that uses a Master page. When a Master page is used as a
template for all other pages in a site, it's a good
place to put a site map and controls that help users find their way
around, because that information will be visible on every page a user
visits. You'll create a site map file that describes
the logical relationship between the pages of your site, and then
you'll add a SiteMapPath control to the Master page
so users can see where they are in the hierarchy and move
"up" and
"down" the path to their current
page.

Launch Visual Studio 2005 and create a new ASP.NET 2.0 web
application. Name the project
C:\ASPNET20\Chap02-Navigation.

In Solution Explorer, add a site map to the application by
right-clicking the project name and selecting Add New
Item Site Map (see Figure 2-16).

Figure 2-16. Adding a site map to the project

Note: A site map is an XML document describing the logical layout
of a web site.

Populate the Web.sitemap file by opening it and
typing in the code shown in Example 2-2.

Tip: Remember to verify that your Web.sitemap XML
document is well-formed (i.e., the document conforms to the rules of
XML). The easiest way to do so is to load the XML document using
Internet Explorer. If it is not well-formed, IE will tell you so.

Example 2-2. A Web.sitemap file

<?xml version="1.0" encoding="utf-8" ?>
<siteMap>
<siteMapNode url="main.aspx" 
title="Windows Mobile Home"
description=" Windows Mobile Home " roles=">
<siteMapNode url="whatiswinmobile.aspx" 
title="What is Windows Mobile"  
description=" What is Windows Mobile " roles=">
<siteMapNode url="windowsmobileoverview.aspx" 
title=" Windows Mobile Overview"  
description=" Windows Mobile Overview " 
roles=" />
<siteMapNode url="comparedevices.aspx" 
title="Compare Devices"  
description=" Compare Devices " roles=" />
<siteMapNode url="software.aspx" 
title="Software Features Tour" 
description=" Software Features Tour " 
roles=" />
<siteMapNode url="faq.aspx" 
title="Frequently Asked Questions" 
description=" Frequently Asked Questions " 
roles=" />
</siteMapNode>
<siteMapNode url="devices.aspx" title="Devices"  
description=" Devices " roles=" />
<siteMapNode url="downloads.aspx" title="Downloads"  
description=" Downloads " roles=" />
<siteMapNode url="howto.aspx" 
title="Help and How To" 
description=" Help and How To " roles=" />
<siteMapNode url="communities.aspx" 
title="Communities"  
description=" Communities " roles=" />
<siteMapNode url="events.aspx" 
title="News and Events" 
description=" News and Events" roles=" />
<siteMapNode url="Administrator/Admin.aspx" 
title="Administrator" 
description=" Administrator" roles=" />
</siteMapNode>
</siteMap>

The Web.sitemap file simply describes the
logical layout of the site. It does not matter where the various
files are physically stored. Note that the schema for the document is
straightforward; elements are nested to represent their logical
groupings.

Each <siteMapNode> element has four attributes:

title

The text to display in each node of a SiteMapPath, TreeView, or Menu
control

description

The Tool Tip text to display when the mouse hovers over a node in a
SiteMapPath, TreeView, or Menu control

roles

The role(s) for which this node is to be displayed

url

The URL to navigate to when a node in a SiteMapPath, TreeView, or
Menu control is clicked

Tip: Note that the value of each url attribute in the <siteMapNode>
element must be unique.

Add a new folder to the project and name it
Images (right-click the project name in Solution
Explorer and select Add
Folder Regular Folder).
Copy the images shown in Figure 2-17 into the
C:\ASPNET20\chap02-Navigation\Images\ folder.
You'll use these on the Master page for this site.

Figure 2-17. The images in the Images folder

Next, add a new Master page to your project. Populate the Master page
with the controls shown in Figure 2-18. The Master
page is the ideal place to locate the SiteMapPath control, because
all controls placed on this page are visible in any page that
inherits from it. As a result, the "bread
crumb" style site navigation path displayed by the
SiteMapPath control will be visible in all pages.

Figure 2-18. Populating the Master page

Add a new Web Form to the project and name it
Main.aspx. Check the "Select
master page" option and select the Master page
created in the previous step (see Figure 2-19).

Figure 2-19. Selecting a Master page for a Web Form

Populate Main.aspx with the content shown in
Figure 2-20.

Figure 2-20. The Main.aspx page

Next, add another Web Form to the site and name it
Windowsmobileoverview.aspx. Populate the form
with the content shown in Figure 2-21.

Figure 2-21. The Windowsmobileoverview.aspx page

To test the pages, press F5 and load the
Main.aspx and
Windowsmobileoverview.aspx pages. You should be
able to see the navigational path shown in Figure 2-22.

Figure 2-22. Testing the SiteMapPath control

2.4.2. How it works

The SiteMapPath control by default reads the content of the
Web.sitemap file and displays the site
navigation path leading to the currently displayed page.

Tip: It is important to note that the SiteMapPath control displays its
path information based on whatever is in the
Web.Sitemap file. It does not necessarily mean
that it will correspond to the physical organization of the site. If
the content of the Web.sitemap file does not
reflect your actual site structure, the information displayed by the
SiteMapPath control would be incorrect as well.

Note that in ASP.NET 2.0 there is only one possible site map
provider: XmlSiteMapProvider. The
XmlSiteMapProvider reads site map information from
a predefined XML document and, by default, that is the
Web.sitemap file.

If you need to change the default name of the site map file, you can
do so via the Web.config file. Example 2-3 shows how you can deregister the default
XmlSiteMapProvider and register it again with a
different site map name: My.sitemap (you can
also register a new site map provider, such as one
you've written yourself).

Example 2-3. Changing the default site map in Web.config

<configuration>
<system.web>
<siteMap>
<providers>
<remove name="AspNetXmlSiteMapProvider" />
<add name="AspNetXmlSiteMapProvider"
type="System.Web.XmlSiteMapProvider,
System.Web, Version=1.2.3400.0, 
Culture=neutral,
PublicKeyToken=b03f5f7f11d50a3a"
siteMapFile="My.sitemap" />
</providers>
</siteMap>
</system.web>
</configuration>

Tip: If you have created your own SiteMapProvider, change the
SiteMapProvider property of the SiteMapPath control to the name of
your own SiteMapProvider.
Note: Chapter 5 will discuss the provider
model that is new in ASP.NET 2.0 in greater detail.

2.4.3. What about...

...customizing the SiteMapPath
control?

The default view of the SiteMapPath control displays the navigation
path using the string contained in the title attribute of the
<siteMapNode> element in the site map file. Each navigation
path is separated by the ">"
character.

You can customize the look and feel of the SiteMapPath control by
adding style information to it. You can customize the SiteMapPath
control by switching to Source View of the page that contains the
control (in our example it is the Master page).

Example 2-4 shows how you can override the default
path-separator character and replace it with an Image control (the
image used is saved in the Images folder of the
application as arrow.gif ). The code also
highlights the current path using a light green background color.

Example 2-4. Customizing the SiteMapPath control

<asp:SiteMapPath ID="SiteMapPath2" 
Font-Name="Garamond" 
Font-Size="12pt" RunAt="server">
<CurrentNodeStyle Height="24px" 
BackColor="LightGreen" 
Font-Bold="true" />
<NodeStyle Height="24px" />
<PathSeparatorTemplate>
<ItemTemplate>
<asp:Image ID="Image2"
ImageUrl="~/Images/arrow.gif" 
RunAt="server" />
</ItemTemplate>
</PathSeparatorTemplate>
</asp:SiteMapPath>

Figure 2-23 shows how the SiteMapPath control looks
like after the modification.

Figure 2-23. Customizing the look and feel of the SiteMapPath control

You can also programmatically modify the properties of the
SiteMapPath control through the following properties:

PathDirection

Sets the order in which the paths are displayed. The default is
RootToCurrent, which displays the topmost path
down to the current path. To display in the reverse order, set this
property to CurrentToRoot.

PathSeparator

Sets the separator to display. Default is
">".

RenderCurrentNodeAsLink

Displays the current path as a hyperlink. Default is false.

...accessing site map information
programmatically?

If you are not using a SiteMapPath control, you can still
programmatically access site map information through the Site Map API
(found in the System.Web.SiteMap namespace). Example 2-5 (located in the code-behind of a Master page)
shows how to display site navigation information programmatically.

Example 2-5. Displaying site information programmatically

Partial Class MasterPage_master
Sub Page_Load(ByVal sender As Object, _
ByVal e As System.EventArgs) _
Handles Me.Load
Dim myCurrentNode As SiteMapNode
'---Gets the current node
myCurrentNode = SiteMap.CurrentNode
'---displays the navigational path---
Dim path As String = myCurrentNode.Title
While myCurrentNode.ParentNode IsNot Nothing
myCurrentNode = myCurrentNode.ParentNode
path = " > " & path
path = myCurrentNode.Title & path
End While
Response.Write(path)
End Sub
End Class

Besides the CurrentNode property, additional properties are available
for accessing site information, including:

SiteMap.CurrentNode.ParentNode

SiteMap.CurrentNode.PreviousSibling

SiteMap.CurrentNode.RootNode

SiteMap.CurrentNode.NextSibling

...hiding nodes from users who lack proper
authorization?

If you examine the Web.sitemap file carefully,
you will notice the role attribute. In the examples thus far, the
role attribute is set to an empty string. By default, the
SiteMapDataSource control makes all the nodes information in
Web.sitemap visible. However, there are times
when you would like to restrict the display of certain nodes to a
particular group of users. For example, normal users should not be
able to see the path to the admin web page, and so the
SiteMapDataSource control should allow nodes to be hidden (or
trimmed). This feature is known as security
trimming. The XmlSiteMapProvider
disables security trimming by default; to enable security trimming,
you need to perform the following steps:

Set the securityTrimmingEnabled attribute to true.
To do so, you can de- and re-register the
AspNetXmlSiteMapProvider in
Web.config:

<system.web>
<siteMap>
<providers>
<remove name="AspNetXmlSiteMapProvider" />
<add name="AspNetXmlSiteMapProvider"
type="System.Web.XmlSiteMapProvider,
System.Web, Version=1.2.3400.0, 
Culture=neutral,
PublicKeyToken=b03f5f7f11d50a3a"
securityTrimmingEnabled="true"
siteMapFile="Web.sitemap" />
</providers>
</siteMap>

Next, specify the node that you want to enable for security trimming.
Using the Web.sitemap file you have created in
this lab, set the roles attribute for the last node to
admin. In this case, the SiteMapPath control will
display the Administrator node (pointing to the page
Admin.aspx located in the
/Administrator directory) only if the user
belongs to the admin role:

         ...
<siteMapNode url="Administrator/Admin.aspx" 
title="Administrator" 
description=" Administrator" roles="admin" />
</siteMapNode>

In the final step, you need to configure the
/Administrator directory to deny access to all
users and then fine-tune the access to allow users belonging to the
admin role to access the Admin.aspx page. You do
so by adding a Web.config file to the
/Administrator directory that contains the code
shown in Example 2-6.

Example 2-6. Web.config for the Administrator directory

<configuration xmlns=
"http://schemas.microsoft.com/.NetConfiguration/v2.0">
<system.web>
<compilation debug="false"/>
<!-- deny all users -->
<authorization>
<deny users="*" />
</authorization>
</system.web>
<!-- allow only Admin role users to see Admin.aspx -->
<location path="Admin.aspx">
<system.web>
<authorization>
<allow roles="Admin" />
</authorization>
</system.web>
</location>
</configuration>

Once you have made these changes, only users in the admin role will
be able to see the Administrator node.

Note: See Chapter 5 for more details on
roles and membership.

2.4.4. Where can I learn more?

For more information on ASP.NET authorization, check out the
following MSDN Help topic: http://msdn.microsoft.com/library/default.asp?url=/library/en-us/cpguide/html/cpconaspnetauthorization.asp.

To learn more about Site Map Providers, check out the MSDN Help topic
"ASP.NET Site Navigation
Providers."

If the included AspNetXMLSiteMapProvider does not
suit your purpose and you want to store your site map information in
a data store other than XML (such as an Oracle database), check out
the MSDN Help topic "Implementing a Site Map
Provider."