Jump to:

23478 Posts in 18941 Topics by 2878 members

General Questions

SilverStripe Forums » General Questions » SilverStripe Navigation Menu and Controllers

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

Page: 1
Go to End
Author Topic: 2849 Views
  • Silverfox5545
    Avatar
    Community Member
    1 Post

    SilverStripe Navigation Menu and Controllers Link to this post

    I am new to SS and have searched long and hard for the answers to my questions before bothering others with them. I have learned a bit in my quest, and have gone through the Tutorials on SS.org and ssbits, however I am still not understanding some of the basics when working with SS and its control codes. Currently, I am trying to get started by using a pre-built theme and modifying it to my particular application. Working on the navigation menu, several questions have come up. Let me preface this by saying I do understand that SS uses variables for pulling data and also has several different folders containing different aspects of the page's layout and behavior. That being said, I have a navigation bar on the left side of the page with five main headings underneath the site root (the one with the globe in the WYSIWYG). When one of the five main headings is clicked I would like to display all of the sub-levels below that heading. Then, when one of the sub-levels is clicked I would like to display a list of the Article Titles that exist underneath the first sub-level as links in the Content area to the right of the navigation menu.
    Then when one of the Article Title links is clicked the full article will replace and display in the same Content area.

    My code so far from the template in the Includes folder:

    <h3>Navigate</h3>
    <ul id="Navigation">
       <% control Menu(1) %>
          <li>
             <a class="$LinkingMode" href="$Link" title="Go to the $Title.XML page">$MenuTitle<span></span></a>
             <% if Children %>
                <% if LinkingMode = section %>
                   <ul id="Sub-Menu">
                      <% control Children %>
                      <li class="$LinkingMode<% if FirstLast %> $FirstLast<% end_if %>">
                         <% if LinkingMode = current %>
                            <a class="items" href="$Link" title="Go to the $Title.XML page">$MenuTitle</a>
                         <% else %>
                            <a class="item" href="$Link" title="Go to the $Title.XML page">$MenuTitle</a>
                         <% end_if %>
                      </li>
                      <% end_control %>
                   </ul>
                <% end_if %>
                <% if LinkingMode = current %>
                   <ul id="Sub-Menu">
                      <% control Children %>
                      <li class="$LinkingMode<% if FirstLast %> $FirstLast<% end_if %>">
                         <% if LinkingMode = current %>
                            <a class="items" href="$Link" title="Go to the $Title.XML page">$MenuTitle</a>
                         <% else %>
                            <a class="item" href="$Link" title="Go to the $Title.XML page">$MenuTitle</a>
                         <% end_if %>
                      </li>
                      <% end_control %>
                   </ul>
                <% end_if %>
             <% end_if %>
          </li>
       <% end_control %>
    </ul>

    I have taken some programming languages and understand basic HTML and CSS. What I cannot figure out is this:

    1. <% control Children %> returns the children of the current page, but doesn't seem to work when I use it underneath the first sub-level.

    2. When I do finally get the third sub-levels to display, how will I tell it to display Sub-pages of itself as the Article Titles and point it to the Content Area, instead of itself?

    3. Will I need to use a loop of some sort to keep checking if their children when using levels and/or for displaying the article titles?

    4. When I use the variable $Title and $LinkingMode how does it know which title, or which link? I don't understand the syntax used in the line: <a class="items" href="$Link" title="Go to the $Title.XML page">$MenuTitle</a>

    I have worded my questions to the best of my ability and hope I have made it as easy as possible for anyone out there to help me.

    Thank you for your time and patience.

  • DesignerX.com.au
    Avatar
    Community Member
    107 Posts

    Re: SilverStripe Navigation Menu and Controllers Link to this post

    Hi, i also kind of stuck on the same thing here, Hope someone can help with his Questions .

    Also, where can i find a "List" of variables used with this cms, so it will have "most common" variables & what they function.. If the list is NOT available, is there anyone willing to help me create such a list.. it will be handy

  • martimiz
    Avatar
    Forum Moderator
    1086 Posts

    Re: SilverStripe Navigation Menu and Controllers Link to this post

    Hi Silverfox5545, welcome to the forums

    First of all: you'll find lots of info in the new SilverStripe docs. For working with templates, this is a nice one (this goes for DesignerX as well):
    http://doc.silverstripe.org/sapphire/en/reference/built-in-page-controls

    As for you question: if I understand you correctly, you have a three-level SiteTree in your CMS, you want the first two levels to be represented in the left menu, and if a page in the second level is clicked, you want to show it's children in the content area of the page.

    The way SilverStripe's templates work, the left menubar and the list in the content area are two separate items. First the sidebar. That would be something like you have already done, sort of simplified, like this:

    <h3>Navigate</h3>
    <ul id="Navigation">
       <% control Menu(1) %>
          <li>
             <a class="$LinkingMode" href="$Link" title="Go to the $Title.XML page">$MenuTitle</a>
             <% if Children %>
                <% if LinkOrSection = section %>
                   <% if Children %>
                      <ul id="Sub-Menu">
                      <% control Children %>
                         <li class="$LinkingMode<% if FirstLast %> $FirstLast<% end_if %>">
                            <a class="items LinkingMode" href="$Link" title="Go to the $Title.XML page">$MenuTitle</a>
                         </li>
                      <% end_control %>
                      </ul>
                   <% end_if %>
                <% end_if %>
             <% end_if %>
          </li>
       <% end_control %>
    </ul>

    The second bit would be placed somewhere in the content part of your page. Since you don't want to show this list of child-pages on root pages, you can filter them out by checking on the ParentID (that's 0 for root pages ). Something like this (typo's not included):

    <% if ParentID %>
       <% if Children %>
          <ul id="ContentMenu">
          <% control Children %>
             <li class="$LinkingMode<% if FirstLast %> $FirstLast<% end_if %>">
                <a class="items LinkingMode" href="$Link" title="Go to the $Title.XML page">$MenuTitle</a>
             </li>
          <% end_control %>
          </ul>
       <% end_if %>
    <% end_if %>

    This should do the trick. This will try to show the list on third level pages as well - but if they have no children, there's no problem. In fact you can throw as many menu's and other stuff on a Page.ss template as you like - the point is how to filter them out for pages you don't want them on. If the filtering gets a bit too complex, then you can think of creating new pagetype, that can have their own template(s).

    Hope this helps some...

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