Copied to clipboard

Flag this post as spam?

This post will be reported to the moderators as potential spam to be looked at


  • Daniel Horn 319 posts 344 karma points
    Jun 20, 2010 @ 11:21
    Daniel Horn
    0

    TopNavigation problem

    I'm using the topnavigation macro for my navigation, and i wan't to put class="active" on the link which you are currently looking at.

    So if you are at information.aspx then in the navigation the information.aspx link shall have class="active" but the other links in the navigation shall not have class="active" - how to do that? I've been playing around with it and I can only get it to either all have class="active" or none...

  • Eran 292 posts 436 karma points
    Jun 20, 2010 @ 12:42
    Eran
    0

    hey,

    i attached the xslt that i'm using for top navigation, that take care for the "active" page (look for  the "selectedClass" variable).

    Eran.

    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE xsl:stylesheet [ <!ENTITY nbsp "&#x00A0;"> ]>
    <xsl:stylesheet
    version="1.0"
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    xmlns:msxml="urn:schemas-microsoft-com:xslt"
    xmlns:umbraco.library="urn:umbraco.library"
    exclude-result-prefixes="msxml umbraco.library">

    <xsl:output method="html" omit-xml-declaration="yes"/>

    <xsl:param name="currentPage" />


    <!--This sets the level that the nav starts at and tells us if we should recurse through child elements-->
    <xsl:variable name="startDepth" select="/macro/startingLevel" />
    <xsl:variable name="recurse" select="/macro/recurse" />
    <xsl:variable name="selectBranches" select="/macro/selectBranches"></xsl:variable>
    <xsl:variable name="maxMenuDepth" select="/macro/maxMenuDepth"></xsl:variable>
    <xsl:variable name="forceNode" select="/macro/forceNode"></xsl:variable>
    <xsl:variable name="walkChildren" select="/macro/expandChildren"></xsl:variable>
    <xsl:variable name="forceHome" select="/macro/forceHome"></xsl:variable>
    <xsl:variable name="subNav" select="/macro/subNav"></xsl:variable>
    <!--Alternate page title variable in here-->

    <!--Styles for the navigation-->
    <xsl:variable name="ulBaseClass" select="/macro/ulBaseClass"></xsl:variable>
    <xsl:variable name="branchClass" select="/macro/branchClass"></xsl:variable>
    <xsl:variable name="selectedClass" select="/macro/selectedClass"></xsl:variable>

    <xsl:variable name="startLevel">
    <xsl:choose>
    <xsl:when test="$startDepth >= 0">
    <xsl:value-of select="$startDepth"/>
    </xsl:when>
    <xsl:otherwise>
    <xsl:value-of select="$currentPage/@level"/>
    </xsl:otherwise>
    </xsl:choose>
    </xsl:variable>

    <!--This calls first iteration of the navigation, sending the first node at the correct depth found in the ancestors of the current page-->
    <xsl:template match="/">
    <xsl:choose>
    <xsl:when test="$forceNode">
    <xsl:variable name="currentNode" select="umbraco.library:GetXmlNodeById($forceNode)"></xsl:variable>
    <xsl:call-template name="nodeIterator">
    <xsl:with-param name="parentNode" select="$currentNode/ancestor-or-self::node[@level=$startLevel] [string(data [@alias='umbracoNaviHide']) != '1']" />
    <xsl:with-param name="pseudoCurrentPage" select="$currentNode" />
    </xsl:call-template>
    </xsl:when>
    <xsl:otherwise>
    <xsl:variable name="currentNode" select="$currentPage"></xsl:variable>
    <xsl:call-template name="nodeIterator">
    <xsl:with-param name="parentNode" select="$currentNode/ancestor-or-self::node[@level=$startLevel] [string(data [@alias='umbracoNaviHide']) != '1']" />
    <xsl:with-param name="pseudoCurrentPage" select="$currentNode" />
    </xsl:call-template>
    </xsl:otherwise>
    </xsl:choose>
    </xsl:template>

    <xsl:template name="nodeIterator">
    <xsl:param name="parentNode" />
    <xsl:param name="pseudoCurrentPage" />
    <!-- do not show customer item and testimony item node types-->
    <xsl:variable name="calculatedMenuDepth" select="($parentNode/@level - $startLevel)+1" />

    <xsl:if test="$parentNode/@nodeTypeAlias!='Testimonials' and $parentNode/@nodeTypeAlias!='Customers'">

    <ul>
    <xsl:attribute name="class">
    <xsl:choose>
    <xsl:when test="$calculatedMenuDepth = 1">
    <xsl:value-of select="concat($ulBaseClass, ' lv', $calculatedMenuDepth)" />
    </xsl:when>
    <xsl:when test="$calculatedMenuDepth > 1">
    <xsl:value-of select="concat($subNav, ' lv', $calculatedMenuDepth)" />
    </xsl:when>
    </xsl:choose>
    </xsl:attribute>

    <xsl:if test="$forceHome = 1 and $calculatedMenuDepth = 1">
    <!-- Create the class for the li element-->
    <li>
    <xsl:attribute name="class">
    <xsl:if test="$currentPage/ancestor-or-self::node[@level=1]/@id = $currentPage/@id">
    <xsl:value-of select="concat($selectedClass,' ')"/>
    </xsl:if>
    <xsl:value-of select="'hasChildren '"/>
    </xsl:attribute>

    <a href="{umbraco.library:NiceUrl($currentPage/ancestor-or-self::node[@level=1]/@id)}">

    <xsl:attribute name="class">
    <xsl:if test="$currentPage/ancestor-or-self::node[@level=1]/@id = $currentPage/@id">
    <xsl:value-of select="concat($selectedClass,' ')"/>
    </xsl:if>
    </xsl:attribute>

    <!--set the innerText for the a element-->
    <!--
    <xsl:value-of select="$currentPage/ancestor-or-self::node[@level=1]/text()"/>

    <xsl:if test="string($currentPage/ancestor-or-self::node[@level=1]/text()) = ''">
    <xsl:value-of select="$currentPage/ancestor-or-self::node[@level=1]/@nodeName"/>
    </xsl:if>
    -->
    <xsl:variable name="homePageNode" select="$currentPage/ancestor-or-self::node [@level = 1]" />
    <xsl:value-of select="$homePageNode/data[@alias='contentPageTitle']/text()"/>
    <xsl:if test="string($homePageNode/data[@alias='contentPageTitle']/text()) = ''">
    <xsl:value-of select="$homePageNode/@nodeName"/>
    </xsl:if>
    </a>
    </li>
    </xsl:if>
    <!--End force home-->


    <!--for each node in the parent node that is not hidden by Umbraco-->

    <xsl:for-each select="$parentNode/node [string(data [@alias='umbracoNaviHide']) != '1']">

    <!--Set the current node id i.e. the node we have looped to not the current page-->
    <xsl:variable name="currentNodeID" select="./@id" />

    <!--Is the node a branch? i.e. are there children and is it in the colletion of ancestor nodes -->
    <xsl:variable name="isBranch">
    <xsl:choose>
    <xsl:when test="$pseudoCurrentPage/ancestor-or-self::node[@id = $currentNodeID]/child::node">1</xsl:when>
    </xsl:choose>
    </xsl:variable>

    <!--Is the node selected? i.e. is it the same as the currentPage node-->
    <xsl:variable name="isSelected">
    <xsl:choose>
    <xsl:when test="$pseudoCurrentPage/@id = $currentNodeID">1</xsl:when>
    </xsl:choose>
    </xsl:variable>

    <xsl:variable name="isSelectedBranch">
    <xsl:choose>
    <xsl:when test="$isBranch = 1 and $selectBranches = 1">1</xsl:when>
    </xsl:choose>
    </xsl:variable>

    <xsl:variable name="hasChildren">
    <xsl:choose>
    <xsl:when test="./node">1</xsl:when>
    </xsl:choose>
    </xsl:variable>

    <li>

    <!-- Create the class for the li element-->
    <xsl:attribute name="class">
    <xsl:if test="$isSelected = 1"> <xsl:value-of select="concat($selectedClass,' ')"/> </xsl:if>
    <xsl:if test="$isSelectedBranch = 1"> <xsl:value-of select="concat($branchClass,' ')"/> </xsl:if>
    <xsl:if test="$hasChildren = 1"><xsl:value-of select="'hasChildren '"/></xsl:if>
    </xsl:attribute>

    <a href="{umbraco.library:NiceUrl(@id)}">

    <xsl:attribute name="class">
    <xsl:if test="$isSelected = 1"> <xsl:value-of select="concat($selectedClass,' ')"/> </xsl:if>
    <xsl:if test="$isSelectedBranch = 1"> <xsl:value-of select="concat($branchClass,' ')"/> </xsl:if>
    </xsl:attribute>

    <!--set the innerText for the a element-->
    <xsl:value-of select="./data[@alias='contentPageTitle']/text()"/>

    <xsl:if test="string(./data[@alias='contentPageTitle']/text()) = ''">
    <xsl:value-of select="@nodeName"/>
    </xsl:if>
    </a>

    <!-- if it's a branch recurse through it's children-->



    <xsl:if test="((($isBranch = 1 and $recurse = 1) or ($walkChildren = 1 and $currentPage/descendant-or-self::node[@id = $currentNodeID]/child::node)) and $maxMenuDepth &gt;= $calculatedMenuDepth)">
    <xsl:call-template name="nodeIterator">
    <xsl:with-param name="parentNode" select="." />
    <xsl:with-param name="pseudoCurrentPage" select="$pseudoCurrentPage" />
    </xsl:call-template>
    </xsl:if>

    </li>

    </xsl:for-each>

    </ul>
    </xsl:if>
    </xsl:template>

    </xsl:stylesheet>
  • Jan Skovgaard 11258 posts 23500 karma points MVP 7x admin c-trib
    Jun 20, 2010 @ 15:59
    Jan Skovgaard
    0

    Hi Daniel

    Can't you use the stuff from the "Navigation prototype" XSLT?

            <a href="{umbraco.library:NiceUrl(@id)}">
                <xsl:if test="$currentPage/ancestor-or-self::node/@id = current()/@id">
                    <!-- we're under the item - you can do your own styling here -->
                    <xsl:attribute name="style">font-weight: bold;</xsl:attribute>
                </xsl:if>

                <xsl:value-of select="@nodeName"/>
            </a>

    Then instead of adding the style attribute just write <xsl:attribute name="class">active</xsl:attribute>

    /Jan

  • MartinB 411 posts 512 karma points
    Jun 20, 2010 @ 16:13
    MartinB
    0

    Here you go: (Just change "current" to whatever you'd like)

    <?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE xsl:stylesheet [ <!ENTITY nbsp "&#x00A0;"> ]>
    <xsl:stylesheet
    version="1.0"
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    xmlns:msxml="urn:schemas-microsoft-com:xslt"
    xmlns:umbraco.library="urn:umbraco.library"
    exclude-result-prefixes="msxml umbraco.library">


    <xsl:output method="xml" omit-xml-declaration="yes" />

    <xsl:param name="currentPage"/>

    <!-- Input the documenttype you want here -->
    <xsl:variable name="level" select="1"/>

    <xsl:template match="/">

    <!-- The fun starts here -->
    <ul id="topMenu">
    <xsl:for-each select="$currentPage/ancestor-or-self::node [@level=$level]/node [string(data [@alias='umbracoNaviHide']) != '1']">
    <li>
    <a href="{umbraco.library:NiceUrl(@id)}">
    <xsl:if test="$currentPage/ancestor-or-self::node/@id = current()/@id">
    <xsl:attribute name="class">current</xsl:attribute>
    </xsl:if>
    <xsl:value-of select="@nodeName"/>
    </a>
    </li>
    </xsl:for-each>
    </ul>

    </xsl:template>

    </xsl:stylesheet>
  • Daniel Horn 319 posts 344 karma points
    Jun 21, 2010 @ 00:47
    Daniel Horn
    0

    Thanks, it worked..

    Doesn't really understand why my own doesn't, but nevermind - thanks for the help guys :)

  • Eran 292 posts 436 karma points
    Jun 21, 2010 @ 15:01
    Eran
    0

    please mark this question as resolved

  • This forum is in read-only mode while we transition to the new forum.

    You can continue this topic on the new forum by tapping the "Continue discussion" link below.

Please Sign in or register to post replies