Navega tu sitio con siteMapPath

Vamos a ver un ejemplo de como agregar navegación simplificada a través de diferentes secciones de nuestro sitio sin importar la estructura de directorios del mismo.

Siguiendo con la idea de utilizar nuestra aplicación base de ejemplo, vamos suponer que tenemos una sección de inscripciones de alumnos y que vamos a mostrar en determinadas páginas de nuestro sitio el camino que recorre la aplicación (Inicio > Alumnos > Inscripciones).

Para ello ASP.NET nos provee de elementos que nos hacen la vida muy facil. Para nuestro ejemplo vamos a utilizar 3 elementos:

- <asp:SiteMapDataSource/>
- <asp:SiteMapPath/>
- Archivo Site Map (xml)

Como se trata de código que nos gustaría utilizar en diferentes páginas de nuestro sitio, vamos a crear un web user control y vamos a agregarle los dos primeros elementos que mencionamos. El código sería algo como lo siguiente:

<%@ Control Language="C#" AutoEventWireup="true"
CodeFile="siteNavigation.ascx.cs" Inherits="commonControls_siteNavigation" %>
<asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" />
<asp:SiteMapPath ID="SiteMapPath1" runat="server"/>

Luego necesitamos crear el archivo web.siteMap.xml. Esto es tan simple como hacer click derecho en la aplicación > Add Item y seleccionar Site Map de las opciones en Visual Studio o bien agregar un archivo xml y nombrarlo web.siteMap.xml.

La estructura de este archivo es como el ejemplo que sigue. Note que todos los archivos están en el directorio raiz de mi aplicación pero a través de los nodos siteMapNode puedo lograr la creación de secciones lógicas de acuerdo a mis necesidades.

<?xml version="1.0" encoding="utf-8" ?>
<siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
   <siteMapNode url="~\inicio.aspx" title="Inicio" description="">
       <siteMapNode url="~\alumnos.aspx" title="Alumnos" description="">
           <siteMapNode url="~\alumnoInscripcion.aspx"
            title="Inscripciones" description="" />
   </siteMapNode>
 </siteMapNode>
</siteMap>

Por último incluimos el web user control que creamos antes en las páginas que necesitamos que se muestre el path de la aplicación. Por ejemplo en nuestra página alumnoInscripcion.aspx:

<%@ Page Language="C#" MasterPageFile="~/MasterPage.master"
  AutoEventWireup="true"
  CodeFile="alumnoInscripcion.aspx.cs" Inherits="alumnoInscripcion"
  Title="Untitled Page" %>
<%@ Register Src="~/commonControls/siteNavigation.ascx"
   TagName="siteNavigation" TagPrefix= "uc1" %>

<asp:Content ID="Content1" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
   <uc1:siteNavigation ID="siteNavigation1" runat="server" />
</asp:Content>

Esto es todo lo que necesitamos; compilamos y ejecutamos la aplicacion y si vamos a nuestra página alumnoInscripcion.aspx veremos algo parecido a la siguiente imagen. Espero que les haya sido útil, no dejen de participar dejando comentarios.