Hi. If I understand your question right then Implementing drop-down menu has nothing to do with Umbraco itself - you just render it as regular HTML and then apply to it any drop down menu technics (javascript or CSS) that you like - you can google lots of those.
Why not? In a regular site you usually draw somthing like <ul> in your html and then apply some CSS or JS to it to turn it to a drop-down menu. Here's the same with the only difference that you're rendering your <ul> with an umbraco macro.
Ok yep I could create the menu using <ul><li> etc but how do I render that using an umbraco macro? Sorry I'm very new to Umbraco and the old cms I used would generate the drop down automatically.
Thanks - I've watched the video and I see how the navigation works. But, it just displays the level one items. How do I make it display the 2nd level as well? Thanks, Sophie
Maybe I wasn't clear. I've got a working menu in place. It displays only the top level items all working no problem.
Through my lack of knowledge with umbraco/xslt etc I don't understand what changes I need to implement to get the 2nd level navigation to display in the menu as well. I'd ideally like it in a dropdown. If you could guide me on that I should be able to control the dropdown with css. Are you able to be more explicit with how I achieve this? Here's the xslt code I have:
How do I create/add a drop down menu?
Hello - please could someone point me to a video or code so that I can implement a drop down menu on my Umbraco site.
Thank you
Hi. If I understand your question right then Implementing drop-down menu has nothing to do with Umbraco itself - you just render it as regular HTML and then apply to it any drop down menu technics (javascript or CSS) that you like - you can google lots of those.
Thanks Rodion - so is there no way to get this working from the normal sub navigation in umbraco?
Why not? In a regular site you usually draw somthing like <ul> in your html and then apply some CSS or JS to it to turn it to a drop-down menu. Here's the same with the only difference that you're rendering your <ul> with an umbraco macro.
Ok yep I could create the menu using <ul><li> etc but how do I render that using an umbraco macro? Sorry I'm very new to Umbraco and the old cms I used would generate the drop down automatically.
Thank you
Here you can watch the video with a sample how a macro can be created:
http://umbraco.com/help-and-support/video-tutorials/introduction-to-umbraco/sitebuilder-introduction/creating-your-first-xslt-macro/TVPlayer
Thanks - I've watched the video and I see how the navigation works. But, it just displays the level one items. How do I make it display the 2nd level as well? Thanks, Sophie
You can create your Xslt macro from the template which you can use as a start point and modify as you like:
Maybe I wasn't clear. I've got a working menu in place. It displays only the top level items all working no problem.
Through my lack of knowledge with umbraco/xslt etc I don't understand what changes I need to implement to get the 2nd level navigation to display in the menu as well. I'd ideally like it in a dropdown. If you could guide me on that I should be able to control the dropdown with css. Are you able to be more explicit with how I achieve this? Here's the xslt code I have:
<?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"/>
<!-- Input the documenttype you want here -->
<xsl:variable name="level" select="1" />
<xsl:template match="/">
<ul id="topNavigation">
<li class="home">
<xsl:if test="$currentPage/@id = $currentPage/ancestor-or-self::* [@level=$level]/@id">
<xsl:attribute name="class">home current</xsl:attribute>
</xsl:if>
<a href="/">Home</a>
</li>
<xsl:for-each select="$currentPage/ancestor-or-self::* [@level=$level]/* [@isDoc and string(umbracoNaviHide) != '1']">
<li>
<xsl:if test="@id = $currentPage/@id">
<xsl:attribute name="class">current</xsl:attribute>
</xsl:if>
<a class="navigation" href="{umbraco.library:NiceUrl(@id)}">
<span><xsl:value-of select="@nodeName"/></span>
</a>
</li>
</xsl:for-each>
</ul>
</xsl:template>
</xsl:stylesheet>
Thanks for your patience
is working on a reply...