Bootstrap and dropdown sub menus

templates
Tags: #<Tag:0x00007f0827499e28>

#1

Hello!

This may be somewhat straight forward, but I’m just curious if anyone has a set way of working with dropdown menus on navbars with Bootstrap, using SilverStripe? As the menu options themselves aren’t clickable (as they action the dropdown), how do you treat that page? For example, is it just a dummy holder page so it’s placed on the navbar, or do you use any page type and list the item on both of navbar and the dropdown itself, and if so, do you use the same text for both links?

For a visual example:
image
How do you treat “Dropdown” (the link on the navbar)?

Hope that makes sense, but as I said, just curious how other people work with these things :slight_smile:


#2

I tend to use MenuManager and Modify to build Nested Menus. That way you can create a Menu Item without a lInk to use as the root. Then you can put the actual page bellow.

If using the Menu() method, I often recommend the client use a Redirector for the Top Level to act as Link a page nested bellow.


#3

I usually use an actual page to group the sub-pages together so that the URLs are still contextual and help with hierarchical understanding. In the template, you can just omit the link for pages which are parents of others. In the event that someone happens to get to the parent URL (via a broken link, or by manually entering it) you can do one of a couple of things:

  1. Make the top page a redirect page to the home page or something like that.
  2. Make the top page a mini-tree of the pages in the section so they can see where they are and where to go.

#4

Thanks both for your replies!

This seems a logical choice. Do you use a specific holding page type for the top page then? Just wondering how this would be enforced given a user may not follow the same style in the CMS itself?


#5

If I’m doing it that way, I’ll make a ‘section page’ or something like that. Just got to educate the CMS users in that case. To be fair, not many of them will be adding top-level sections to the site in my experience.


#6

That makes sense. Thanks for sharing! Always useful to get an insight on how others work.