Introducción

ASP.NET es un excelente marco de trabajo de aplicaciones web que puede utilizar para crear sitios web y aplicaciones web dinámicos. Puede utilizar ASP.NET para administrar sus enlaces y crear una forma coherente para que sus usuarios naveguen por su sitio web.

Los sitios web siempre deben mostrar datos de navegación para guiar a los usuarios a través de un sitio web.

En este artículo, le mostraremos cómo usar ASP.NET para crear una jerarquía de navegación del sitio.

Cómo crear una jerarquía de navegación del sitio con ASP.NET

Navegación del sitio ASP.NET

Puede administrar su sitio utilizando la navegación del sitio ASP.NET. sus características incluyen;

  • Mapas del sitio – Estos «mapas» se utilizan para describir cómo se ve su sitio, o en otras palabras, la estructura de su sitio. A medida que su sitio crece, puede cambiar los mapas del sitio y agregar o eliminar páginas. Esto es útil porque no tiene que cambiar los hipervínculos para todas sus páginas web.
  • Controles ASP.NET – Los controles son útiles cuando desea mostrar menús de navegación para su sitio.
  • Navegación de página

Utilice la navegación del sitio para describir la estructura de su sitio como una jerarquía. Primero define la jerarquía de su sitio web en un archivo XML. Puede elegir si desea usar eso SiteMapPath, Vista de árbol o Menú dinámico Control para mostrar una ruta de navegación (también conocida como ruta de navegación o ceja). La ruta de navegación muestra la página actual y los enlaces como una ruta que conduce a la página de inicio.

Reglas para crear un archivo de mapa del sitio

El archivo XML debe ser un -Etiqueta que envuelve el contenido.

La La etiqueta solo debe tener un nodo secundario () en la sección de la página de inicio. Cada nodo () puede tener varios nodos secundarios o páginas web. Cada nodo debe tener atributos que definan el título y la URL del sitio web.

Por ejemplo un SiteMapPath puede verse algo como esto;

En casa > Servicios > capacitación

En cuanto a eso Vista de árbol El control aparecería como una estructura en forma de árbol que muestra enlaces a varias páginas de su sitio. Utiliza nodos que se pueden expandir o contraer al hacer clic. Un ejemplo de estructura TreeView es:

En casa
– servicios
+ Entrenamiento

Un ejemplo de su código es;

<asp:SiteMapDataSource id="nav1" runat="server" />
<form runat="server">
<asp:TreeView runat="server" DataSourceId="nav1" />
</form>

La se conecta al archivo Web.sitemap.

Finalmente, eso Dinámica Menú Los controles muestran un menú expandible que permite a los usuarios navegar a diferentes áreas de su sitio. Al igual que el control TreeView, utiliza nodos. En este caso, sin embargo, los nodos se expanden cuando el cursor está sobre el elemento del menú. Un ejemplo de un código de menú dinámico es:

<asp:SiteMapDataSource id="nav1" runat="server" />
<form runat="server">
<asp:Menu runat="server" DataSourceId="nav1" />
</form>

La se conecta al archivo Web.sitemap.

Para utilizar estos controles, primero debe describir la estructura de su sitio en un archivo web.sitemap.

Cree un archivo Web.sitemap

Cree y vea un nuevo archivo en la carpeta raíz de su sitio Mapa del sitio web. Abra el archivo que creó y agregue las siguientes líneas de código. Puede reemplazar el contenido predeterminado de las páginas web de su sitio web.

<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>

Guarde el archivo y ciérrelo. El archivo anterior contiene siteMapNode Elementos anidados en tres niveles.

Conclusión

En este artículo logramos crear un mapa del sitio para nuestro sitio y demostrar cómo crear la navegación del sitio usando controles ASP.NET. Puede adaptar el código a la navegación de su sitio.