Jump to:

23377 Posts in 18296 Topics by 2867 members

General Questions

SilverStripe Forums » General Questions » I have the code now where to put it? help

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 2
Go to End
Author Topic: 888 Views
  • Lemonie
    Avatar
    Community Member
    70 Posts

    I have the code now where to put it? help Link to this post

    I am trying to get a charity website up and running. I understand that you want people to learn for themselves but at the moment I need to get the site up and running and money coming in!

    I would like to install a simple dropdown menu on the site. I have downloaded the code from cssmenu.co.uk and have tried implementing it with disasterous results. My menu content disappeared and the menu flew out and across the header to the left.

    I am using the 'centered' option here: cssmenus.co.uk/dropdown.html

    I have uploaded the images .. no problem as am changing them.
    I am fine with the .css

    <b>the navigation element itself I am not fine with</b>

    -----------------------------------------------------------------------------------------------------

    <ul id="menu">
       <li><a href="index.html"><b>Home</b></a></li>
       <li><a href="single.html"><b>Single Level</b></a></li>
       <li class="current"><a class="sub" href="dropdown.html"><b>Dropdown</b><!--[if gte IE 7]><!--></a><!--<![endif]-->
       <!--[if lte IE 6]><table><tr><td><![endif]-->
          <ul class="sub1">
             <li><a class="fly" href="#url">Dropdown one<!--[if gte IE 7]><!--></a><!--<![endif]-->
             <!--[if lte IE 6]><table><tr><td><![endif]-->
                <ul class="fly1">
                   <li><a href="#url">Dropdown 1.1</a></li>
                   <li><a href="#url">Dropdown 1.2</a></li>
                   <li><a href="#url">Dropdown 1.3</a></li>
                   <li><a href="#url">Dropdown 1.4</a></li>
                   <li><a href="#url">Dropdown 1.5</a></li>
                   <li><a href="#url">Dropdown 1.6</a></li>
                </ul>
             <!--[if lte IE 6]></td></tr></table></a><![endif]-->
             </li>
             <li class="currentsub"><a class="fly" href="#url">Dropdown two<!--[if gte IE 7]><!--></a><!--<![endif]-->
             <!--[if lte IE 6]><table><tr><td><![endif]-->
                <ul class="fly2">
                   <li><a href="#url">Dropdown 2.1</a></li>
                   <li><a href="#url">Dropdown 2.2</a></li>
                   <li class="currentfly"><a href="#url">Dropdown 2.3</a></li>
                   <li><a href="#url">Dropdown 2.4</a></li>
                   <li><a href="#url">Dropdown 2.5</a></li>
                </ul>
             <!--[if lte IE 6]></td></tr></table></a><![endif]-->
             </li>
             <li><a href="#url">Dropdown three</a></li>
             <li><a href="#url">Dropdown four</a></li>
             <li><a class="fly" href="#url">Dropdown five<!--[if gte IE 7]><!--></a><!--<![endif]-->
             <!--[if lte IE 6]><table><tr><td><![endif]-->
                <ul class="fly3">
                   <li><a href="#url">Dropdown 5.1</a></li>
                   <li><a href="#url">Dropdown 2.2</a></li>
                   <li><a href="#url">Dropdown 3.3</a></li>
                </ul>
             <!--[if lte IE 6]></td></tr></table></a><![endif]-->
             </li>
          </ul>
       <!--[if lte IE 6]></td></tr></table></a><![endif]-->
       </li>
       <li><a class="sub" href="dropline.html"><b>Dropline</b><!--[if gte IE 7]><!--></a><!--<![endif]-->
       <!--[if lte IE 6]><table><tr><td><![endif]-->
          <ul class="sub2">
             <li><a href="#url">Dropline one</a></li>
             <li><a href="#url">Dropline two</a></li>
             <li><a href="#url">Dropline three</a></li>
             <li><a href="#url">Dropline four</a></li>
             <li><a href="#url">Dropline five</a></li>
             <li><a href="#url">Dropline six</a></li>
          </ul>
       <!--[if lte IE 6]></td></tr></table></a><![endif]-->
       </li>
       <li><a class="sub" href="flyout.html"><b>Flyout</b><!--[if gte IE 7]><!--></a><!--<![endif]-->
       <!--[if lte IE 6]><table><tr><td><![endif]-->
          <ul class="sub3">
             <li><a href="#url">Flyout one</a></li>
             <li><a href="#url">Flyout two</a></li>
             <li><a href="#url">Flyout three</a></li>
             <li><a href="#url">Flyout four</a></li>
          </ul>
       <!--[if lte IE 6]></td></tr></table></a><![endif]-->
       </li>
       <li id="support"><a href="support.html"><b>Support</b></a></li>
       <li id="contact"><a href="contact.html"><b>Contact</b></a></li>
    </ul>

    ---------------------------------------------------------------------------------------------------------------------

    I just really don't know where to start with this, please help.

  • swaiba
    Avatar
    Forum Moderator
    1785 Posts

    Re: I have the code now where to put it? help Link to this post

    I believe you are looking for...

    themes\YOURTHEMENAME\templates\Includes\Navigation.ss

    not this shows the first level menu only, you'll need to combine it with templates\Includes\SideBar.ss that shows the second level of menu.

    The key is the

    <% control Menu(1) %>

    or

    <% control Menu(2) %>

  • Webdoc
    Avatar
    Community Member
    332 Posts

    Re: I have the code now where to put it? help Link to this post

    made dropline like so:

    <ul id="dropline">
       <% control Menu(1) %>
       <% if Children %>
       <li class="$LinkingMode"><a href="$Link" title="Go to the $Title.XML page"><b>$MenuTitle.XML</b></a>
             <div>
             <ul>
             <% control Children %>
             <li class="current_sub"><a href="$Link" title="Go to the $Title.XML page" class="$LinkingMode"><span>$MenuTitle.XML</span></a></li>
             <% end_control %>
             </ul>
             </div>
       </li>
       <% else %>
       <li class="$LinkingMode"><a href="$Link" title="Go to the $Title.XML page"><b>$MenuTitle.XML</b></a><div>
             <ul></ul>
             </div></li>
       <% end_if %>
       <% end_control %>
    </ul>

  • Lemonie
    Avatar
    Community Member
    70 Posts

    Re: I have the code now where to put it? help Link to this post

    Thanks for the replies.

    I have added the css (uploaded below) and added webdocs code (thank you) but the result is all the menu's showing at once (have attached a screenshot.

    Any ideas what is causing this?

    Attached Files
  • Webdoc
    Avatar
    Community Member
    332 Posts

    Re: I have the code now where to put it? help Link to this post

    if your sitetree structure for dropdown is like so:

    Page 1
    -subpage 1
    -subpage 2
    --subpage for subpage 2
    Page 2
    Page 3

    it works tryed in my server - http://www.e-sstonia.ee/demo/
    themes/yourtheme/templates/Includes/Navigation.ss

    <ul id="menu">
    <% control Menu(1) %>
    <% if Children %>
    <li class="$LinkingMode"><a class="sub" href="$Link" title="Go to the $Title.XML page"><b>$MenuTitle.XML</b></a>
    <ul>
    <% control Children %>
    <li>
                 <a <% if Children %>class="fly"<% else %><% end_if %> href="$Link" title="Go to the $Title.XML page" class="$LinkingMode"><span>$MenuTitle.XML</span></a>
                 <% if Children %>
                 <ul class="fly">
                 <% control Children %>
                 <li>
                 <a href="$Link" title="Go to the $Title.XML page" class="$LinkingMode"><span>$MenuTitle.XML</span></a>
                 </li>
                 <% end_control %>
                 </ul>
                 <% end_if %>
                 </li>
    <% end_control %>
    </ul>
    </li>
    <% else %>
    <li class="$LinkingMode"><a href="$Link" title="Go to the $Title.XML page"><b>$MenuTitle.XML</b></a><div>
    <ul></ul>
    </div></li>
    <% end_if %>
    <% end_control %>
    </ul>

  • Lemonie
    Avatar
    Community Member
    70 Posts

    Re: I have the code now where to put it? help Link to this post

    Thanks for that Webdoc. I now have a menu where it should be with dropdowns. The only problem now is that the dropdowns go behind the body/content area:

    http://www.homelesshounds.org.uk/index.php/

  • Webdoc
    Avatar
    Community Member
    332 Posts

    Re: I have the code now where to put it? help Link to this post

    In your Layout.css line 483 where is - ul#menu - remove overflow:hidden;
    also find line: ul#menu :hover ul li a - and change the width for something biger then the drop down will be wider @ moment its 95px change like 125px then your Fostering Application menu will be in one line;

  • Lemonie
    Avatar
    Community Member
    70 Posts

    Re: I have the code now where to put it? help Link to this post

    Thank you soo much Webdoc. I really appreciate your help.

    888 Views
Page: 1 2
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.