Jump to:

1384 Posts in 493 Topics by 522 members

Themes

SilverStripe Forums » Themes » 3rd level menu

Discuss SilverStripe Themes.

Moderators: martimiz, Sean, biapar, Willr, Ingo, swaiba, simon_w

Page: 1
Go to End
Author Topic: 2737 Views
  • Webdoc
    Avatar
    Community Member
    332 Posts

    3rd level menu Link to this post

    How to crteate 3rd level menu in blackcandy theme.

    The menu code is:

    <div id="Sidebar" class="typography">
       <div class="sidebarBox">
          <h3>
             <% control Level(1) %>
                $Title
             <% end_control %>
          </h3>
          
          <ul id="Menu2">
              <% control Menu(2) %>
              <% if Children %>
                  <li class="$LinkingMode"><a href="$Link" title="Go to the $Title.XML page" class="$LinkingMode levela"><span><em>$MenuTitle.XML</em></span></a>
               <% else %>
                    <li><a href="$Link" title="Go to the $Title.XML page" class="$LinkingMode levela"><span><em>$MenuTitle.XML</em></span></a>
                <% end_if %>   
              
                 <% if LinkOrSection = section %>
                    <% if Children %>
                      <ul class="sub">
                         <li>
                            <ul class="roundWhite">
                               <% control Children %>
                                  <li><a href="$Link" title="Go to the $Title.XML page" class="$LinkingMode levelb"><span><em>$MenuTitle.XML</em></span></a></li>
                               <% end_control %>
                            </ul>
                         </li>
                      </ul>
                     <% end_if %>
                <% end_if %>
             </li>
             <% end_control %>
          </ul>
          <div class="clear"></div>
       </div>
       <div class="sidebarBottom"></div>
    </div>

  • Savy
    Avatar
    Community Member
    4 Posts

    Re: 3rd level menu Link to this post

    Have you tested this? I'm trying to use a 3rd level menu for over a week now, still no luck. I did managed to make it appear, but not to apear on click (it opens when I click on the 2nd level menu items).

  • Pigeon
    Avatar
    Community Member
    243 Posts

    Re: 3rd level menu Link to this post

    What's the issue with just using:

    <% control Menu(3) %>
    ...
    <% end_control %>

    I'm using this on a current project right now...

  • Shauna G
    Avatar
    Community Member
    52 Posts

    Re: 3rd level menu Link to this post

    Savy - The second level menus open on mouseover because of CSS. Simply apply styling to the second level's "li:hover"/"a:hover" section in the CSS like it is for the first level menus (to display second level), and your 3rd level should work the same as the second. It might take a little playing with the CSS to get it lined up right.

  • Sylar2010
    Avatar
    Community Member
    3 Posts

    Re: 3rd level menu Link to this post

    Here's a code to display a 3rd level menu on the same page. Obviously, you would need to style the <ul> and <li> within you CSS, but the general idea is there:

    <div id="Sidebar" class="typography">
    <div class="sidebarBox">
    <h3>
    <% control Level(1) %>
    $Title
    <% end_control %>
    </h3>

    <ul id="Menu2">
    <% control Menu(2) %>
    <% if Children %>
    <li class="$LinkingMode"><a href="$Link" title="Go to the $Title.XML page" class="$LinkingMode levela"><span><em>$MenuTitle</em></span></a>
    <% else %>
    <li><a href="$Link" title="Go to the $Title.XML page" class="$LinkingMode levela"><span><em>$MenuTitle</em></span></a>
    <% end_if %>
    <ul class="sub">
    <span class="roundWhite">
    <% control Children %>
    <li><a href="$Link" title="Go to the $Title.XML page" class="$LinkingMode levelb"><span><em>$MenuTitle</em></span></a></li>
    <% if LinkOrSection = section %>
    <% if Children %>
    <ul class="sub">
    <li>
    <ul>
    <span class="roundWhite">
    <% control Children %>
    <li><a href="$Link" title="Go to the $Title.XML page" class="$LinkingMode levelb"><span><em>$MenuTitle</em></span></a></li>
    <% end_control %>
    </span>
    </ul>
    <% end_control %>
    </span>
    </ul>
    </li>
    </ul>
    <% end_if %>
    <% end_if %>
    <% end_control %>
    <div class="clear"></div>
    </div>
    <div class="sidebarBottom"></div>
    </div>

    2737 Views
Page: 1
Go to Top

Want to know more about the company that brought you SilverStripe? Then check out SilverStripe.com

Comments on this website? Please give feedback.