Jump to:

22997 Posts in 11853 Topics by 2828 members

General Questions

SilverStripe Forums » General Questions » Multiple Styles in Top Level Menu

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: 923 Views
  • ShadeFrozen
    Avatar
    Community Member
    10 Posts

    Multiple Styles in Top Level Menu Link to this post

    Hi there,

    Coming from a ColdFusion background I am new to Silverstripe but so far I love it, and perhaps because I have a programming background, I found ALL of the tutorials easy to understand and an absolute must for "newbies". But there is one thing that currently has me stumped, and it is to do with the styling of the top level menu items. An example to demonstrate what I wish to achieve...

    Currently my included navigation.ss file looks like so:
    <ul>
    <% control Menu(1) %>   
    <li><a href="$Link" title="Go to the $Title.XML page" class="$LinkingMode"><span>$MenuTitle</span></a></li>
    <% end_control %>
    </ul>

    That's all fine and dandy and everything works fine. But I want more than just the page name in the menu text. The above would generate based on the four pages I have allowed to display:

    <ul>   
    <li><a href="/home/" class="current"><span>Home</span></a></li>
    <li><a href="/about-us/" class="link"><span>About Us</span></a></li>
    <li><a href="/contact-us/" class="link"><span>Contact Us</span></a></li>
    <li><a href="/news/" class="link"><span>News</span></a></li>
    </ul>

    But what I need is something more than just the actual Menu title in the link. i.e. in the above example I want to display:
    <li><a href="/home/" class="current"><span>Home</span> GORE NZ</a></li>

    Then I can use CSS to make the two look different and place the additional text on a new line. Is there any way of achieving this short of *hacking* with something like:

    <ul>
    <% control Menu(1) %>   
    <li>
    <a href="$Link" title="Go to the $Title.XML page" class="$LinkingMode"><span>$MenuTitle</span></a>
    <% if MenuTitle(home) %>
    GORE NZ
    <% else %>
    <% if MenuTitle(about us) %>
    AN OVERVIEW
    <% end_if %>
    </li>
    <% end_control %>
    </ul>

    ... although I just tried that and it adds GORE NZ to all of the navigation items. Any ideas or help appreciated.

    TIA
    Mark

  • ShadeFrozen
    Avatar
    Community Member
    10 Posts

    Re: Multiple Styles in Top Level Menu Link to this post

    So to answer my own rather silly question, after stopping and actually thinking about it (yes I was having a "der" moment up there in my first post so I apologise for that) the simple solution is:

    Extending page.php I added

    function getCMSFields() {
    $fields = parent::getCMSFields();
    $fields->addFieldToTab('Root.Content.Main', new TextField('SubNavText'), 'Content');
    return $fields;
    }

    static $db = array(
    'SubNavText' => 'Text'
    );

    Rebuilt the database, then in the nav include (navigation.ss) I added the subnavtext field.

    <ul>
    <% control Menu(1) %>   
       <li><a href="$Link" title="Go to the $Title.XML page" class="$LinkingMode"><span>$MenuTitle</span> $SubNavText
       </a></li>
    <% end_control %>
    </ul>

    did a flush, and it works fine. Again, sorry about the dumb question and this is obviously why no one replied, but that isn't always a bad thing, since finding the solution ones self and having a 'light bulb' moment is often more beneficial.

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