Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

Themes /

Discuss SilverStripe Themes.

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

3rd level menu


Reply


5 Posts   2772 Views

Avatar
Webdoc

Community Member, 332 Posts

28 November 2009 at 1:14am

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>

Avatar
Savy

Community Member, 4 Posts

7 July 2010 at 1:05am

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).

Avatar
Pigeon

Community Member, 243 Posts

7 July 2010 at 11:22am

What's the issue with just using:

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

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

Avatar
Shauna G

Community Member, 52 Posts

21 July 2010 at 11:41am

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.

Avatar
Sylar2010

Community Member, 3 Posts

20 October 2010 at 10:00am

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>