Creating the Navigation Menu

by Andreas Hartmann

This file (menu.xsl) is used to create the navigation menu. The file can be used for any site of a simple hierarchical structure (sections and pages). The layout of the menu is only controlled by this file and the menu.css stylesheet.

<?xml version='1.0'?>
<xsl:stylesheet
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version='1.0'
    xmlns:xlink="http://www.w3.org/1999/xlink"

Using a dedicated namespace for the site makes it possible to use the same tag names in the XML page files.

    xmlns:site="http://www.bonebreakerbikes.com">

Match the site (doesn't do anything here).

<!-- site -->
  <xsl:template match="site:site">
    <xsl:apply-templates/>
  </xsl:template>

Match the sections.

<!-- sections -->
<xsl:template match="site:section">
  <!-- display section title -->
  <xsl:apply-templates select="site:title"/>
  <!-- include link list if this is the current section -->

Match the current section and display the page list.

  <xsl:if test="@name = $section">
    <ul>
      <xsl:apply-templates select="site:page"/>
    </ul>
  </xsl:if>
</xsl:template>

Match the section titles.

<!-- section titles -->
<xsl:template match="site:title">
  <p>
    <xsl:choose>

Match the current section and use the CSS class "menu-section-selected".

      <xsl:when test="../@name = $section">
        <a class="menu-section-selected"
            href="{$base-url}/{../@name}/home.section">
          <xsl:apply-templates/>
        </a>
      </xsl:when>

Match all other sections and use the CSS class "menu-section".

      <xsl:otherwise>
        <a class="menu-section"
            href="{$base-url}/{../@name}/home.section">
          <xsl:apply-templates/>
        </a>
      </xsl:otherwise>
    </xsl:choose>
  </p>
</xsl:template>

Match the pages.

<!-- pages -->
<xsl:template match="site:page">
  <li class="menu-page">
  <xsl:choose>

Match the currently displayed page. Do not create a link.

    <xsl:when test="@xlink:href = $request-url">
      <strong><xsl:apply-templates/></strong>
    </xsl:when>

Match all other pages. Create a link.

    <xsl:otherwise>
      <xsl:choose>

External link (do not include path information)

        <!-- external link? -->
        <xsl:when test="@ext='true'">
          <a href="{@xlink:href}"><xsl:apply-templates/></a>
        </xsl:when>

Internal link (include path information)

        <xsl:otherwise>
          <a href="{$base-url}/{../@name}/{@xlink:href}">
            <xsl:apply-templates/>
          </a>
        </xsl:otherwise>

      </xsl:choose>
    </xsl:otherwise>
  </xsl:choose>
  </li>
</xsl:template>

</xsl:stylesheet>