Copied to clipboard

Flag this post as spam?

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


  • Rachel Skuse 88 posts 118 karma points
    Feb 23, 2010 @ 13:27
    Rachel Skuse
    0

    Sub Level Navigation is not displaying

    Hi,

    I was kindly helped, last week, to correctly display my top level navigation where the first and last list items have a different class. I am now trying to get my sub level navigation to work but it is not displaying.

    I am trying to create a structure similar to the following:

    <ul id="mainNav">
          <li><a href="#" class="main" id="mainNavLeft">Home</a></li>
          <li><a href="#" class="main">Top Level 1</a>
                <ul>
                      <li><a href="#">Sub Level Item></a></li>
                      <li><a href="#">Sub Level Item</a></li>
                     <li><a href="#">Sub Level Item</a></li>
                      <li><a href="#">Sub Level Item</a>
                </ul>
          </li>
          <li><a href="#" class="main">Top Level 2</a>
                <ul>
                      <li><a href="#">Sub Level Item></a></li>
                      <li><a href="#">Sub Level Item</a></li>
                      <li><a href="#">Sub Level Item</a></li>
                      <li><a href="#">Sub Level Item</a>
                </ul>
          </li>
          <li><a href="#" class="main">Top Level 3</a></li>
          <li><a href="#" class="main">Top Level 4</a></li>
          <li><a href="#" class="main">Top Level 5</a></li>
    </ul>

     

    The code I have is:

    <ul id="mainNav">
    <xsl:for-each select="$currentPage/ancestor-or-self::node [@level=$level]/node [string(data [@alias='umbracoNaviHide']) != '1']">
        <li>
              <a href="{umbraco.library:NiceUrl(@id)}" class="main">
                    <xsl:choose>
                          <xsl:when test="position() = 1">
                            <xsl:attribute name="id">
                                  <xsl:text>mainNavLeft</xsl:text>
                            </xsl:attribute>
                          </xsl:when>
                          <xsl:when test="position() = last()">
                            <xsl:attribute name="id">
                                  <xsl:text>mainNavRight</xsl:text>
                            </xsl:attribute>
                          </xsl:when>
                    </xsl:choose>
                    <xsl:value-of select="@nodeName" />
              </a>
        <xsl:if test="$currentPage/ancestor-or-self::node/@id = current()/@id">
                <ul>
                    <xsl:for-each select="$currentPage/node [string(data [@alias='umbracoNaviHide']) != '0']">
                        <li>
                            <a href="{umbraco.library:NiceUrl(@id)}">
                                <xsl:value-of select="@nodeName"/>
                            </a>
                        </li>
                    </xsl:for-each>
                </ul>
            </xsl:if>
        </li>
    </xsl:for-each>
    </ul>

     

    But I am having problem getting the sub nav to show?

    Thanks,

    Rachel

  • Chriztian Steinmeier 2800 posts 8790 karma points MVP 8x admin c-trib
    Feb 23, 2010 @ 13:49
    Chriztian Steinmeier
    0

    Hi Rachel,

    Try this and let me know if that's what you're after:

    <ul id="mainNav">
        <xsl:for-each select="$currentPage/ancestor-or-self::node[@level = $level]/node[not(data[@alias = 'umbracoNaviHide'] = 1)]">
            <li>
                <a href="{umbraco.library:NiceUrl(@id)}" class="main">
                    <xsl:attribute name="id">
                        <xsl:choose>
                            <xsl:when test="position() = 1">
                                <xsl:text>mainNavLeft</xsl:text>
                            </xsl:when>
                            <xsl:when test="position() = last()">
                                <xsl:text>mainNavRight</xsl:text>
                            </xsl:when>
                        </xsl:choose>
                    </xsl:attribute>
                    <xsl:value-of select="@nodeName" />
                </a>
                <!-- Check for pages below the current mainItem being processed -->
                <xsl:if test="node[not(data[@alias = 'umbracoNaviHide'] = 1)]">
                    <ul>
                        <xsl:for-each select="node[not(data[@alias = 'umbracoNaviHide'] = 1)]">
                            <li>
                                <a href="{umbraco.library:NiceUrl(@id)}">
                                    <xsl:value-of select="@nodeName"/>
                                </a>
                            </li>
                        </xsl:for-each>
                    </ul>
                </xsl:if>
            </li>
        </xsl:for-each>
    </ul>

    /Chriztian

  • Dirk De Grave 4541 posts 6021 karma points MVP 3x admin c-trib
    Feb 23, 2010 @ 13:52
    Dirk De Grave
    0

    Hi Rachel,

    you won't get a sub level nav when you're on the sub level page because you're using the $currentPage param in the inner for-each loop, I think you need to replace

    $currentPage/node [string(data [@alias='umbracoNaviHide']) != '0']

    in inner loop with 

    ./node [string(data [@alias='umbracoNaviHide']) != '0']

    where '.' (dot) refers to the current page being processed in the outer-loop

    Also, do you need to list all sub level pages (top level 1 & top level 2) or only sub level pages from a single parent (either top level 1 or top level 2). Current code will only work in second scenario.

     

    Hope this helps.

    Regards,

    /Dirk

     

     

     

  • Rachel Skuse 88 posts 118 karma points
    Feb 23, 2010 @ 14:46
    Rachel Skuse
    0

    Hi both, thank you very much for your responses.

    Chriztian, your code has made my sub level visible as I would like but it is displaying ALL sub levels where I need only the sub level pages from a parent to display (as Dirk mentions) - ideally on hover of the button. I am not sure how to incorporate Dirk's suggested code within Chriztian's code?

    Thanks,

    Rachel

  • Chriztian Steinmeier 2800 posts 8790 karma points MVP 8x admin c-trib
    Feb 25, 2010 @ 00:46
    Chriztian Steinmeier
    0

    Hi again,

    I'm a bit confused - you're talking about hovering to see the sublevels? If that's the effect you're after, you should probably combine my XSLT above with some CSS to hide the sublevels, revealing only one at a time, right?

    Take a look at the "Son of Suckerfish Dropdowns" from HTML Dog for an easy solution to this.

    Hope I didn't misunderstand you completely there...

    /Chriztian 

  • Rachel Skuse 88 posts 118 karma points
    Mar 01, 2010 @ 14:21
    Rachel Skuse
    0

    Hi Chriztian,

    I think it's actually my css that is not working - I had it working in a plain html file but it's not working through my xslt. I think I just need to keep tweaking!

    Thanks,

    Rachel

Please Sign in or register to post replies

Write your reply to:

Draft