|
|
 Rank: Enthusiast
Joined: 8/21/2008 Posts: 28 Location: Kolkata, India
|
I was having problem creating XSLT navigational menu. But Dirk helped mr a lot to solve it. Now I can view my menu on webpage. But it is showing in a vertical was as list. I want it to look horizontal with main menu items only and showing sub menues on mouse over. Please can anybody help me out ........... here is my XSLT code Code:
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE xsl:Stylesheet [ <!ENTITY nbsp " "> ]> <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"/>
<xsl:template match="/">
<!-- start writing XSLT -->
<ul id="Navi"> <xsl:for-each select="$currentPage/ancestor::root/node [string(./data [@alias='umbracoNaviHide']) != '1']"> <li> <xsl:if test="$currentPage/@id=current()/@id"> <xsl:attribute name="class"></xsl:attribute> </xsl:if> <a href="{umbraco.library:NiceUrl(@id)}"> <xsl:attribute name="title"><xsl:value-of select="@nodeName" /></xsl:attribute> <xsl:value-of select="@nodeName" /> </a> </li> </xsl:for-each>
<xsl:for-each select="$currentPage/ancestor-or-self::node [@level=1]/node [string(./data [@alias='umbracoNaviHide']) != '1']"> <li> <xsl:if test="$currentPage/ancestor-or-self::node/@id = current()/@id"> <xsl:attribute name="class">Selected</xsl:attribute> </xsl:if> <a href="{umbraco.library:NiceUrl(@id)}"> <xsl:attribute name="title"><xsl:value-of select="@nodeName" /></xsl:attribute> <xsl:value-of select="@nodeName" /> </a> </li> </xsl:for-each>
</ul>
</xsl:template>
</xsl:stylesheet>
|
|
 Rank: Enthusiast
Joined: 5/28/2008 Posts: 45 Location: Bristol, UK
|
Hi Satamita, You'll need to use CSS to apply the appropriate styles to your menu (also to make them appear horizontally, instead of vertically). Take a read over this article on A List Apart for details about "Suckerfish Dropdowns": http://alistapart.com/articles/dropdownsGood luck, - Lee http://leekelleher.com/
|
|
 Rank: Enthusiast
Joined: 8/21/2008 Posts: 28 Location: Kolkata, India
|
Hi Lee, Thanks for this link. It really worked for me. The menu is reday. But I am facing a strange problem. As per my XSLT script this menu is always showing the child nodes of selected main none. I mean to say that on mouse over event its showing the childnodes of the selected nodes for each mainnode. I want this menu to show childnodes of mouseover mainnode. Can you please help me in this matter......... my modified XSLT code is Code:
<?xml version="1.0" encoding="UTF-8"?> <!DOCTYPE xsl:Stylesheet [ <!ENTITY nbsp " "> ]> <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"/>
<xsl:template match="/">
<!-- start writing XSLT --> <script type="text/javascript"><!--//--><![CDATA[//><!--
startList = function() { if (document.all&&document.getElementById) { navRoot = document.getElementById("Navi"); for (i=0; i<navRoot.childNodes.length; i++) { node = navRoot.childNodes[i]; if (node.nodeName=="LI") { node.onmouseover=function() { this.className+=" over"; } node.onmouseout=function() { this.className=this.className.replace(" over", ""); } } } } } window.onload=startList;
//--><!]]></script>
<ul id="Navi"> <xsl:for-each select="$currentPage/ancestor::root/node [string(./data [@alias='umbracoNaviHide']) != '1']"> <li id="first"> <xsl:if test="$currentPage/@id=current()/@id"> <xsl:attribute name="class">Selected</xsl:attribute> </xsl:if> <a href="{umbraco.library:NiceUrl(@id)}"> <xsl:attribute name="title"><xsl:value-of select="@nodeName" /></xsl:attribute> <xsl:value-of select="@nodeName" /> </a> <ul> <xsl:for-each select="$currentPage/ancestor-or-self::node [@level=1]/node [string(./data [@alias='umbracoNaviHide']) != '1']">
<li> <xsl:if test="$currentPage/ancestor-or-self::node/@id = current()/@id"> <xsl:attribute name="class">Selected</xsl:attribute> </xsl:if> <a href="{umbraco.library:NiceUrl(@id)}"> <xsl:attribute name="title"><xsl:value-of select="@nodeName" /></xsl:attribute> <xsl:value-of select="@nodeName" /> </a> </li> </xsl:for-each> </ul> </li> </xsl:for-each>
</ul>
</xsl:template>
</xsl:stylesheet>
Thanks, Satamita
|
|
 Rank: Enthusiast
Joined: 8/21/2008 Posts: 28 Location: Kolkata, India
|
Lee, Actually I mean to say I want to select node id on mouse over so that i can show its childnodes on mouseover event.
Thanks, Satamita
|
|
 Rank: Enthusiast
Joined: 8/21/2008 Posts: 28 Location: Kolkata, India
|
Hi Lee, I solved this. Thanks budy for your help.[:d/]
|
|
 Rank: Enthusiast
Joined: 5/28/2008 Posts: 45 Location: Bristol, UK
|
Hi Satamita, sorry for not getting back to you - we've had a long holiday weekend in the UK. I'm glad you've resolved the issue. Cheers, - Lee http://leekelleher.com/
|
|
 Rank: Enthusiast
Joined: 8/21/2008 Posts: 28 Location: Kolkata, India
|
Hi Lee, How was your vacation ? Do you know anything about selecting the childnodes of a particular mainnode. Say I have a mainnode called 'Frontpage' . I just wants its suvnodes. Is that possible and how?
Satamita
|
|
 Rank: Umbracoholic
Joined: 9/27/2007 Posts: 1,136 Location: Belgium
|
Hi Satamita, Create an xslt and corresponding macro. Pass in a parameter (could be the id of the 'Frontpage' node), and write following construct in the xslt: Code:<xsl:param name="id" select="/macro/NodeId" /> and Code:<xsl:for-each select="umbraco.library:GetXmlNodeById($id)/node"> blabla </xsl:for-each> Macro should have a parameter of type 'Content Picker' and alias 'NodeId' Hope that helps. Regards, /Dirk
level 1 & 2 certified - umbraco MVP 2008/2009 - umbraco blog at netaddicts.be - working on an integrated forum4umbraco
|
|
 Rank: Enthusiast
Joined: 8/21/2008 Posts: 28 Location: Kolkata, India
|
Hi Dirk, Thanks you. I have another query. Do know how to get the first and last node of an mainnode. my code: Code:<xsl:for-each select="$currentPage/ancestor::root/node"> <xsl:if test="@nodeName = 'Frontpage'"> <xsl:for-each select="$currentPage/ancestor-or-self::node [@level=1]/node"> <strong><xsl:value-of select="@nodeName" /></strong>"," </xsl:for-each> </xsl:if> </xsl:for-each>
here I am getting the output as a1","a2","a3","a4"," But my desired output is like a1","a2","a3","a1 in case of lastnode it will be only <strong><xsl:value-of select="@nodeName" /></strong> is that possible? Thanks in advance Satamita
|
|
 Rank: Umbracoholic
Joined: 9/27/2007 Posts: 1,136 Location: Belgium
|
Yep, there are some nice xslt functions available which are exactly what you're after. Have a google search for position(), first() and last() You could use Code:<xsl:if test="position() = first()">...</xsl:if> and Code:<xsl:if test="position() = last()">...</xsl:if> Greetz, /Dirk
level 1 & 2 certified - umbraco MVP 2008/2009 - umbraco blog at netaddicts.be - working on an integrated forum4umbraco
|
|
 Rank: Enthusiast
Joined: 8/21/2008 Posts: 28 Location: Kolkata, India
|
Dirk, Thanks for the solution. I have another query. In the macro I have added a contentTree parameter. it is selecting a particular node from the template page. Code:<?UMBRACO_MACRO macroAlias="XSLTNavi" contentTree="1055"></?UMBRACO_MACRO>
in XSLT I have wriiten this Code:<!-- start writing XSLT --> <xsl:variable name="n1" select="/macro/contentTree/node/nodeName"/>
<xsl:for-each select="$currentPage/ancestor::root/node"> <xsl:if test="@nodeName = $n1"> <xsl:for-each select="$currentPage/ancestor-or-self::node [@level=1]/node"> <xsl:if test="position() = last()"> "<b><xsl:value-of select="@nodeName" /></b>" </xsl:if> <xsl:if test="position() != last()"> "<b><xsl:value-of select="@nodeName" /></b>", </xsl:if> </xsl:for-each> </xsl:if> </xsl:for-each>
This xslt result is nothing.Here I want the childnodes of the node in the parameter. Do you think this line Code:<xsl:variable name="n1" select="/macro/contentTree/node/nodeName"/>
is alright? I am not sure if this variable value is the nodename. cuz it is giving desired result when I write Code:<xsl:if test="@nodeName = 'Home'"> Please help me solve this. Thanks , Satamita
|
|
 Rank: Umbracoholic
Joined: 9/27/2007 Posts: 1,136 Location: Belgium
|
Hi Satamita, Nope, next statement Code:<xsl:variable name="n1" select="/macro/contentTree/node/nodeName"/>
is not correct! Getting the param is done using /macro/contentTree and this only returns "1055". Can be solved in two ways: Code:<xsl:variable name="n1" select="umbraco.library:GetXmlNodeById(/macro/contentTree)"/>
or Code:<xsl:variable name="n1" select="/macro/contentTree" /> and <xsl:for-each select="umbraco.library:GetXmlNodeById($n1)/node"> to loop over all childnodes of node with id 1055 Hope that helps. Regards, /Dirk
level 1 & 2 certified - umbraco MVP 2008/2009 - umbraco blog at netaddicts.be - working on an integrated forum4umbraco
|
|
 Rank: Enthusiast
Joined: 8/21/2008 Posts: 28 Location: Kolkata, India
|
Dirk This is not working for me. What I want is the name of the node with id 1055 in the variable name. do you think this line will do it? Code:
<xsl:variable name="n1" select="umbraco.library:GetXmlNodeById(/macro/contentTree)"/>
It is not giving it.
|
|
 Rank: Umbracoholic
Joined: 9/27/2007 Posts: 1,136 Location: Belgium
|
Yeah Satamita, Code:<xsl:variable name="n1" select="umbraco.library:GetXmlNodeById(/macro/contentTree)"/> gives a node, and all you need to add is /@nodeName Nothing more, nothing less! Regards, /Dirk
level 1 & 2 certified - umbraco MVP 2008/2009 - umbraco blog at netaddicts.be - working on an integrated forum4umbraco
|
|
 Rank: Enthusiast
Joined: 8/21/2008 Posts: 28 Location: Kolkata, India
|
Dirk, I dont know what is wrong in the code. I have used what you have said before. But still its not giving the result. Please go through the code below and let me know what is wrong. Code: <xsl:variable name="n1" select="umbraco.library:GetXmlNodeById(/macro/contentTree)"/> <xsl:for-each select="$currentPage/ancestor::root/node"> <xsl:if test="@nodeName = $n1/@nodeName"> <xsl:for-each select="$currentPage/ancestor-or-self::node [@level=1]/node"> <xsl:if test="position() = last()"> "<b><xsl:value-of select="@nodeName" /></b>" </xsl:if> <xsl:if test="position() != last()"> "<b><xsl:value-of select="@nodeName" /></b>", </xsl:if> </xsl:for-each>
If I use 'Frontpage' instead of $nt/@nodename its giving the result.Here 'Frontpage ' is the nodename. Thanks, Satamita
|
|
|
Guest |