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.

General Questions

General questions about getting started with SilverStripe that don't fit in any of the categories above.

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

Nested UL for Navigation


Reply

3 Posts   1521 Views

Avatar
Breastfed

7 March 2009 at 7:52am (Last edited: 7 March 2009 7:53am), Community Member, 44 Posts

Hello

i am now looking more than 1 hour for the Solution of a Nested UL as a Navigation.

The Output Code should look like:

<ul id="nav" class="dropdown">
<li><a href="general-questions/editpost/255645#">First Level</a>
<ul>
<li><a href="general-questions/editpost/255645#">Second Level</a></li>
</ul>
</li>
</ul>

My SS Code is the following:

   <!-- begin: menu -->
<ul id="nav" class="dropdown">
<% control Menu(1) %>
      <li class="$LinkingMode"><a href="$Link" title="Go to the "{$Title}" page">$MenuTitle</a>
      <% if Menu(2) %>
         <ul>
       <% control Menu(2) %>
      <li class="$LinkingMode"><a href="$Link" title="Go to the "{$Title}" page">$MenuTitle</a></li>
       <% end_control %>
         </ul>
      <% end_if %>
</li>
<% end_control %>
</ul>
   <!-- end: menu -->

Anyone who might help me out?

Thanks!

Avatar
Breastfed

7 March 2009 at 7:59am Community Member, 44 Posts

Sorry - i just found something with luck i would say :)

Anyway i will post the Code for somebody with same Needs.

   <!-- begin: menu -->
<ul id="nav" class="dropdown">
<% control Menu(1) %>
      <li class="$LinkingMode"><a href="$Link" title="Go to the &quot;{$Title}&quot; page">$MenuTitle</a>
      <% if Children %>
         <ul>
       <% control Children %>
      <li class="$LinkingMode secondLevel"><a href="$Link" title="Go to the &quot;{$Title}&quot; page">$MenuTitle</a></li>
       <% end_control %>
         </ul>
      <% end_if %>
</li>
<% end_control %>
</ul>
   <!-- end: menu -->

Sorry again!

Avatar
b_carr

17 June 2009 at 11:41am (Last edited: 18 June 2009 3:14am), Community Member, 2 Posts

Very handy, I made a minor modification for sites that use separate top and left hand navigation - like ones with the brightside theme. Hope it helps someone!

<ul class="sidemenu">
<% control Menu(2) %>

   <li><a href="$Link" title="Go to the $Title page" class="$LinkingMode">$MenuTitle</a></li>

   <% if Children %>
   <% if LinkOrSection = section %>
   <ul class="sidemenu2">
   <% control Children %>

      <li><a href="$Link" title="Go to the $Title page" class="$LinkingMode">$MenuTitle</a></li>
      <% if Children %>
      <% if LinkOrSection = section %>
         <ul class="sidemenu3">
         <% control Children %>
         <li><a href="$Link" title="Go to the $Title page" class="$LinkingMode">$MenuTitle</a></li>
         <% end_control %>
         </ul>
      <% end_if %>
      <% end_if %>
   <% end_control %>
   </ul>
   <% end_if %>
   <% end_if %>

<% end_control %>
</ul>