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   1526 Views

Avatar
Breastfed

Community Member, 44 Posts

7 March 2009 at 7:52am

Edited: 07/03/2009 7:53am

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

Community Member, 44 Posts

7 March 2009 at 7:59am

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

Community Member, 2 Posts

17 June 2009 at 11:41am

Edited: 18/06/2009 3:14am

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>