Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

Themes /

Discuss SilverStripe Themes.

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

Custom navigation with images and third level drop down


Reply


5 Posts   1262 Views

Avatar
BexKelleher

Community Member, 3 Posts

15 December 2010 at 7:45pm

Hi everyone,

I'm fairly new to silverstripe and PHP and haven't been able to implement a third/grandchild level of navigation (all of the menu navigation is at the top of the page with a drop down off the main menu images, image attached) I have the second level drop down working, but need to have the third level work if there are child pages under the second level. I have read a lot of posts now and my code looks okay compared to the samples I've seen. It could be a javascript or a css issue, but I just wanted to check that the navigation code was okay before perusing possible other issues.

CODE:

<ul id="casestudiessubmenu" class="submenu">
<% control ChildrenOf(case-studies) %>
   <li>
      <a href="$Link" title="Go to the $Title.XML page" class="$LinkingMode"><span>$MenuTitle.XML</span></a>
<% if Children %>
<ul class="subsubmenu">
<% control Children %>
<li><a href="$Link" title="Go to the $Title page" class="$LinkingMode">$MenuTitle.XML</a></li>
<% end_control %>
</ul>
<% end_if %>
   </li>
<% end_control %>
</ul>

The reason I used images was to get the font I wanted. I know it's not recommended :).

Any help appreciated!

Thanks,

Rebecca

Attached Files
Avatar
simon_w

Forum Moderator, 474 Posts

15 December 2010 at 8:32pm

That looks like it'll produce the right output to me. One way to check is to see if it does actually create the HTML for the nested menus.

Also, I would use an include rather than copying + pasting the code each time. If you don't know how to do that, I think one of the first two tutorials on the wiki cover it.

Avatar
BexKelleher

Community Member, 3 Posts

15 December 2010 at 8:35pm

Edited: 15/12/2010 8:36pm

Hi, thanks for your response!

It doesn't output the HTML sadly.. Does this mean it is my HTML/SS code that's the problem?

Avatar
simon_w

Forum Moderator, 474 Posts

15 December 2010 at 9:01pm

If there's no <ul id="casestudiessubmenu" class="submenu">, it means your code isn't being called.

If that doesn't have any child elements, it means there's no page with the URL case-studies, that page has no children, or you're already in a control loop. If it's the latter, use Top.ChildrenOf(case-studies) instead.

If there're no subsubmenus, it means that none of the children of case-studies have children.

If the pages exist in the CMS but are yellow it means they're only in the draft site, so they'll either need to be published or you'll need to switch to the draft site (the links are at the bottom of the CMS) to see them.

Avatar
BexKelleher

Community Member, 3 Posts

16 December 2010 at 5:05pm

Hi Simon,

<ul id="casestudiessubmenu" class="submenu"> is displayed in the HTML, just not the grandchildren, also the pages are published, I can navigate to them by links or typing the address into the browser.

Perhaps I will have to give up on a custom font and go back to the original code!

Thanks for your help