Jump to:

5450 Posts in 1672 Topics by 1197 members

Customising the CMS

SilverStripe Forums » Customising the CMS » 2 separated menus

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

Page: 1
Go to End
Author Topic: 1919 Views
  • Eldar
    Avatar
    Community Member
    4 Posts

    2 separated menus Link to this post

    Hello! I'm a newbie in SS. I have a problem how to make two separated menus in my website. The first one is on the top and the other on the left. Each menu items of the both kind must have a submenu items. And I want to use also SSDropDownMenu module both on the top menu & on the left one. I have surfed this forum and did not find out how to do it. Did anybody met such problem and what is the solution. Thanks!

  • banal
    Avatar
    Community Member
    901 Posts

    Re: 2 separated menus Link to this post

    Hi and welcome to SilverStripe

    I never used SSDropDownMenu so I can't help you with that. Creating two separate menus can be done in several ways, here's one:
    - Create two redirector pages, called menu1 and menu2 (make sure their URL is set to these values)
    - Disable the "Show in menus" option for both redirector pages.
    - Build your first menu inside of the menu1 page, and the other pages inside of menu2
    - Make the redirector pages point to a page inside the menu

    In the template you can now build two separate menus like this:

    <ul>
    <% control ChildrenOf(menu1) %>
       <li><a href="$Link">$Title</a>
          <% if Children %>
          <ul>
             <% control Children %>
             <li><a href="$Link">$Title</a></li>
             <% end_control %>
          </ul>
          <% end_if %>
       </li>
    <% end_control %>
    </ul>

    <ul>
    <% control ChildrenOf(menu2) %>
       <li><a href="$Link">$Title</a>
          <% if Children %>
          <ul>
             <% control Children %>
             <li><a href="$Link">$Title</a></li>
             <% end_control %>
          </ul>
          <% end_if %>
       </li>
    <% end_control %>
    </ul>

    This will build two navigations with 2 levels each. Since the code to build the menu is the same for both menus, you can put the inner block inside an include.

  • Eldar
    Avatar
    Community Member
    4 Posts

    Re: 2 separated menus Link to this post

    banal,
    thank you for help! it works!

  • servalman
    Avatar
    Community Member
    211 Posts

    Re: 2 separated menus Link to this post

    Hello Guys

    I tried your solution it seems to work but something weird is happening :

    when I clik on one item of menu1 for exemple, then menus 1 is repeating itself on the nav in the sidebar

    wich is logical but I don't know how to remove it

    any idea ?

    I'm stuck

    Attached Files
  • associative
    Avatar
    Community Member
    1 Post

    Re: 2 separated menus Link to this post

    Hi!
    tried this solution but in my case it had the drawback that the redirector pages showed up in the url and the Breadcrumb (I think) and in the end I needed them to be top-level (thought of doing a .htaccess rewrite but it remained “hacky”).

    So, what I did for having to separate top-level-acting menus –one lateral and the other horizontal– was:

    1. added a "menuLocationHorizontal" db-field to my page.php SiteTree:

    static $db = array( 'menuLocationHorizontal' => "Boolean" );

    2. added into the getCMSFileds section a Checkbox:

    $fields->addFieldToTab('Root.Behaviour', new CheckboxField('menuLocationHorizontal',"Show up in horizontal menu?"),"ShowInSearch");

    this added the Option into the Behaviour tab right after the “show in menu” checkbox (to read: before the ShowInSearch checkbox) .

    3. into the lateral Navigation.ss template:

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

    It reads: if menuLocationHorizontal is unchecked (default state) then output the item

    4. And finally into the horizontalMenu.ss include:

    <ul>
       <% control Menu(1) %>
          <% if menuLocation == 1 %>

    meaning that a page having the “Show up in horizontal menu?” checkbox checked will show up in my second (horizontal) menu.

    Cheers!

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