I'm building a site where i need to have menu items that are not clickable but still contains children.
So far i found and edited the following xslt:
As you can see i just removed the a tag for the ul "menu" which only contains 1 link and that works great, but it doesn't help me further down the road in levels >1
<!-- Input the documenttype you want here --> <!-- Typically '1' for topnavigtaion and '2' for 2nd level --> <!-- Use div elements around this macro combined with css --> <!-- for styling the navigation --> <xsl:variable name="level" select="1"/>
<xsl:template match="/">
<!-- The fun starts here --> <ul id="menu"> <xsl:for-each select="$currentPage/ancestor-or-self::node [@level=$level]/node [string(data [@alias='umbracoNaviHide']) != '1']"> <li>
<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="class">current</xsl:attribute> </xsl:if> <xsl:value-of select="@nodeName"/>
<xsl:if test="($currentPage/@id=current()/@id and count(current()/node) > 0) or ($currentPage/@parentID = ./@id)"> <ul> <xsl:for-each select="current()/node"> <li> <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="class">current</xsl:attribute> </xsl:if> <xsl:value-of select="@nodeName"/> </a> </li> </xsl:for-each> </ul> </xsl:if> </li> </xsl:for-each> </ul>
<xsl:choose>
<xsl:when test="level() > 2">
<li>
<!-- you menu code here without a link -->
</li>
</xsl:when>
<xsl:otherwise>
<li>
<a href={umbraco.library:NiceUrl(@id)}>
<!-- your other menu code -->
</a>
</li>
</xsl:otherwise>
</xsl:choose>
As i've worked a bit more with the site and Umbraco i've got a working menu with dropdown features from jQuery.
What you suggest is a nice solution, but actually i need to test wether a page has childnodes or not. It's only then that i dont want the parent to be an active link.
How would that look if i had to put it into the following xslt?
<!-- Input the documenttype you want here --> <!-- Typically '1' for topnavigtaion and '2' for 2nd level --> <!-- Use div elements around this macro combined with css --> <!-- for styling the navigation --> <xsl:variable name="level" select="1"/>
<xsl:template match="/"> <!-- The fun starts here --> <ul id="menu" class="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"> <!-- we're under the item - you can do your own styling here --> <xsl:attribute name="class">current</xsl:attribute> </xsl:if> <xsl:value-of select="@nodeName"/> </a> <!--If a node has children, show them on hover--> <xsl:if test="($currentPage/@id and count(current()/node) > 0) or ($currentPage/@parentID = ./@id)"> <ul id="submenu" class="topmenuSub"> <xsl:for-each select="current()/node"> <li> <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="class">current</xsl:attribute> </xsl:if> <xsl:value-of select="@nodeName"/> </a> </li> </xsl:for-each> </ul> </xsl:if> </li> </xsl:for-each> </ul>
<!--If a node has children, show them on hover-->
<xsl:if test="(count(./node) > 0 and $currentPage/ancestor-or-self::node/@id = current()/@id)">
This is the current node and it has children
</xsl:if>
You can use the count() function to check for child nodes and assign an attribute if it meets your conditions
This should work....
<a href="{umbraco.library:NiceUrl(@id)}"> <xsl:if test="$currentPage/ancestor-or-self::node/@id = current()/@id and count(current()/node) = 0"> <!-- we're under the item - you can do your own styling here --> <xsl:attribute name="class">current</xsl:attribute> </xsl:if>
<xsl:otherwise> <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="class">current</xsl:attribute> </xsl:if> <xsl:value-of select="@nodeName"/> </a> </xsl:otherwise> </xsl:choose> </xsl:otherwise>
<!-- Input the documenttype you want here --> <!-- Typically '1' for topnavigtaion and '2' for 2nd level --> <!-- Use div elements around this macro combined with css --> <!-- for styling the navigation --> <xsl:variable name="level" select="1"/>
<xsl:template match="/">
<!-- The fun starts here --> <ul id="menu"> <xsl:for-each select="$currentPage/ancestor-or-self::node [@level=$level]/node [string(data [@alias='umbracoNaviHide']) != '1']"> <li>
<xsl:otherwise> <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="class">current</xsl:attribute> </xsl:if> <xsl:value-of select="@nodeName"/> </a> </xsl:otherwise> </xsl:choose> </xsl:otherwise> </xsl:choose>
<!--If a node has children, show them on hover--> <xsl:if test="($currentPage/@id and count(current()/node [string(data [@alias='umbracoNaviHide']) != '1']) > 0) or ($currentPage/@parentID = ./@id) "> <ul id="submenu"> <xsl:for-each select="current()/node"> <li> <xsl:choose> <xsl:when test="./data [@alias='externalLink'] = 1"> <a href="{./data [@alias='link']}" target="_blank"> <xsl:value-of select="@nodeName"/> </a> </xsl:when>
<xsl:otherwise> <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="class">current</xsl:attribute> </xsl:if> <xsl:value-of select="@nodeName"/> </a> </xsl:otherwise> </xsl:choose> </li> </xsl:for-each> </ul> </xsl:if> </li> </xsl:for-each> </ul>
New to Xslt - Menu only a tags
Hi there
I'm building a site where i need to have menu items that are not clickable but still contains children.
So far i found and edited the following xslt:
As you can see i just removed the a tag for the ul "menu" which only contains 1 link and that works great, but it doesn't help me further down the road in levels >1
Any suggestions? Thanks in advance
Oh i forgot to mention that 3rd level links are handled by another xslt
You could do something in an xsl:choose, like so:
You can do multiple xsl:when's if you want.
Hi Sebastiaan
Thanks for the reply.
As i've worked a bit more with the site and Umbraco i've got a working menu with dropdown features from jQuery.
What you suggest is a nice solution, but actually i need to test wether a page has childnodes or not. It's only then that i dont want the parent to be an active link.
How would that look if i had to put it into the following xslt?
Obviously it seems like some of this can be used, i just dont know much about xslt yet:
Anyone who has a suggestion about this?
Hey Martin,
Try something like this
Rich
You can use the count() function to check for child nodes and assign an attribute if it meets your conditions
This should work....
Hi guys
Thanks for your help, i'll give it a go in just a moment! :)
Hi again
sorry for the late reply. I've been busy setting up content :-)
Though both your suggestions are valid, i came up with the following, for full control:
And the full xslt (if someone could benefit from it)
is working on a reply...