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.

Template Questions /

Unwanted <ul></ul> in Navigation


Reply


2 Posts   474 Views

Avatar
DrGreenThumb

Community Member, 1 Post

17 December 2012 at 10:30am

Edited: 17/12/2012 11:32am

Hi there,

I'm creating a 3-level-navigation at the moment. For designing it afterwards with CSS, I need to put some <ul> and <li> tags around the navigation points. However, Silverstripe 3 creates too many <ul></ul>s.

Here is my Silverstripe code:

<div id="navi">
   <% if Menu(1) %>
      <ul><% loop Menu(1) %>     
         <li><a href="$Link" title="go to $Title">$MenuTitle</a></li>
   <% if ClassName = Page %>
            <ul><% loop Children %>
               <li><a href="$Link" title="go to $Title">$MenuTitle</a></li>
                  <ul><% loop Children %>
                     <li><a href="$Link" title="go to $Title">$MenuTitle</a></li>
                  <% end_loop %></ul>
            <% end_loop %></ul>
   <% end_if %>
   <% end_loop %></ul>
   <% end_if %>
   <% if LinkOrSection = section %>
   <% end_if %>
</div>

And here is the result on the final page:

<div id="navi">
   <ul>
      <li><a href="/~silverstripe/" title="go to Page 1">Page 1</a></li>
            
                         <ul></ul>
                     
      <li><a href="/~silverstripe/page-2/" title="go to Page 2">Page 2</a></li>
          <ul>
             <li><a href="/~silverstripe/page-2/page-2.1/" title="go to Page 2.1">Page 2.1</a></li>
                <ul>
                   <li><a href="/~silverstripe/page-2/page-2.1/page-2.1.1/" title="go to Page 2.1.1">Page 2.1.1</a></li>
                   <li><a href="/~silverstripe/page-2/page-2.1/page-2.1.2/" title="go to Page 2.1.2">Page 2.1.2</a></li>
                </ul>
             <li><a href="/~silverstripe/page-2/page-2.2/" title="go to Page 2.2">Page 2.2</a></li>
      
                         <ul></ul>

          </ul>
      <li><a href="/~silverstripe/page-3/" title="go to Page 3">Page 3</a></li>
                     
                         <ul></ul>
                     
      <li><a href="/~silverstripe/page-4/" title="go to Page 4">Page 4</a></li>
                     
                         <ul></ul>
                     
   </ul>
</div>

For better readabilty, I have renamed the pages. As you can see, there are a lot of unneccessary <ul></ul>s after each loop that found no subpoints. Do you have any idea how I can get them out?

Thank you very much in advance!

Avatar
kaanuni

Community Member, 22 Posts

20 December 2012 at 3:36am

This is because the tags are outside of the loop block. However moving them inside the loop would not solve your problem. You need to do something like this:

<% if Children %>
<ul>
<% loop Children %>
<li>....</li>
<% end_loop>
</ul>
<% end_if %>