Copied to clipboard

Flag this post as spam?

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


  • Laura Holland 82 posts 103 karma points
    Sep 15, 2011 @ 03:51
    Laura Holland
    0

    Breadcrumb combined with final node level drop down menu

    I have a nice breadcrumb that works great (thanks to the xslt templates that come with Umbraco).. I want to add a drop down menu at the end of the breadcrumb, that will show other nodes at the same level as the last item on the breadcrumb (by hovering over ">>") :

    Category > Subcategory > SubSubCategory1 >>

    By hovering over ">>", you would see and be able to click:

    • SubSubCategory2
    • SubSubCategory3
    • SubSubCategory4

    I know how to get the css/html working on the hidden dropdown, but no luck yet with the xslt. Here's my breadcrumb:

    <xsl:param name="currentPage"/>
    <xsl:variable name="minLevel" select="2"/>

    <xsl:template match="/">
    <xsl:if test="$currentPage/@level &gt; $minLevel">
    <ul>
    <xsl:for-each select="$currentPage/ancestor::* [@level &gt; $minLevel and string(umbracoNaviHide) != '1']">
    <li>
    <a href="{umbraco.library:NiceUrl(@id)}">
    <xsl:if test="$currentPage/@level &gt; $minLevel">
    <!-- we're under the item - you can do your own styling here -->
    <xsl:attribute name="class">sub</xsl:attribute>
    </xsl:if>
    <xsl:value-of select="@nodeName"/>
    </a>
    <xsl:text> / </xsl:text>
    </li>
    </xsl:for-each>

    <!-- print currentpage -->
    <li>
    <xsl:value-of select="$currentPage/@nodeName"/>
    </li>
    </ul>
    </xsl:if>
    </xsl:template>

     

  • Rich Green 2246 posts 4008 karma points
    Sep 15, 2011 @ 08:08
    Rich Green
    0

    Hey Laura,

    It will probably help if you post the HTML mark up you are trying to achieve, and also a picture of your content tree.

    Rich 

  • Laura Holland 82 posts 103 karma points
    Sep 16, 2011 @ 22:28
    Laura Holland
    0

    The HTML output I am looking for is something like (see my content tree below):

    **breadcrumb (for this example, we're on the "Gold" page)**
    <ul>
    <li><a href="/collections/womens.aspx" class="sub">Womens</a> / </li>
    <li><a href="/collections/womens/necklaces.aspx" class="sub">Necklaces</a> / </li>
    <li><a href="#>Gold ></a>
    **drop down menu that shows nodes at same level as "Gold" when hovered over "Gold"**
    <ul>
    <li><a href="/collections/zodiac.aspx">Zodiac</a></li>
    <li><a href="/collections/etcetera.aspx">Etcetera</a><li>
    </ul>
    </li>
    </ul>

Please Sign in or register to post replies

Write your reply to:

Draft