Jump to:

1347 Posts in 439 Topics by 514 members

Themes

SilverStripe Forums » Themes » Issues creating a 'dynamic' sub-menu

Discuss SilverStripe Themes.

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

Page: 1
Go to End
Author Topic: 1409 Views
  • Akaidu
    Avatar
    Community Member
    2 Posts

    Issues creating a 'dynamic' sub-menu Link to this post

    So I have the basic menu set up:
    ---------
    -Active Page
    -Page
    -Page
    -Page
    ---------

    I'm wanting to get something along the lines of this:

    ---------
    -Active page
    -Sub-page
    -Sub-Page
    -Page
    -Page
    -Sub-Page (hidden in menu)
    -Sub-Page (hidden in menu)
    ---------

    I came across this:

    <% if Menu(2) %>
    <h2><% control Level(1) %>$Title<% end_control %></h2>
    <div class="list">
    <ul>
    <% 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>
    <!-- list -->
    <p>&nbsp;</p>
    <% end_if %>

    But try as I might I just can't get it working. Perhaps I'm putting it in the wrong place? Maybe some of those 2s should be 1s? As a SilverStripe newbie, I'm just not sure. Any help would be appreciated.

  • martimiz
    Avatar
    Forum Moderator
    1038 Posts

    Re: Issues creating a 'dynamic' sub-menu Link to this post

    Supposing the basic set of pages you talk about are all root pages, a very simple menu would work like this. Menu(1) will give you the rootpages: for each page you check if it has any children, and if it does, you create a nested unordered list for them.

    <% if Menu(1) %>
       <ul>
       <% control Menu(1) %>
       <li>
          <a class="$LinkingMode" href="$Link">$MenuTitle</a>
          <% if Children %>
             <ul>
                <% control Children %>
                <li>
                   <a class="$LinkingMode" href="$Link">$MenuTitle</a>
                </li>
                <% end_control %>
             </ul>
          <% end_if %>
       </li>
       <% end_control %>
       </ul>
    <% end_if %>

    The actual design/hiding/showing will need some classes/javascript - but this will give you the basics.

    Using Menu(2) instead of Menu(1) would give you all childpages of the currentpage, so that would work fine for a submenu.

  • markjames
    Avatar
    Community Member
    2 Posts

    Re: Issues creating a 'dynamic' sub-menu Link to this post

    I required the same functionality (but to any sub-level), so I created a module for it if you're interested: https://github.com/markjames/silverstripe-nestedmenu

  • Akaidu
    Avatar
    Community Member
    2 Posts

    Re: Issues creating a 'dynamic' sub-menu Link to this post

    Many thanks, guys.

    Marti - I already have the design working as it should be, I just need it to hide/show the sub-menu based on whether the active page has children or not, and if so: Only show the the children of the active page.

    Mark - Thanks for the link and module, I'll certainly give it a look and see if I can't figure out how it works.

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