A very short post to help other people that might run into the problem of finding the holy grail: a responsive, multilevel menu built with Bootstrap3.
Bootstrap 3 removed support for multilevel dropdowns, citing usability issues as the cause. I argue that there is a use case for multilevel menus when used sparingly and responsively. In a recent project I built with bootstrap, I found myself needing a 2 level main menu. I had assumed that Bootstrap could do this- after all its advantage is its ability to take anything you throw at it.
So when my submenus were not working I went on a hunt for a solution. It was not easy; I combed through stack echange questions, github issues and blog posts. I tried javascript hacks and css fixes. The biggest problem was getting it to work when the menu collapsed in small screens, and to work on click and not on hover.
When I finally found the answer I was skeptical at first:
Smartmenus is a jquery plugin to create responsive multilevel menus. I had considered using a standalone responsive menu script, but it seemed like a nightmare to integrate it with bootstrap styles and functionality. However, smartmenus has a plugin designed to work specifically with Bootstrap, and to respect all the bootstrap styles you have defined; it just extends the functionality! You can have navigations with multiple levels, and it automatically works on hover for large screens and on click when collapsed.
Implementing is easy, just include the javascript for the menu and the bootstrap plugin after your bootstrap js and the bootstrap plugin css after your theme css. No configuration necessary, and works with fixed and regular navs.
Great, saved my day! Thanks a lot!
This save my night. It really help me to solve the multilevel problem with BS3.
Thanks a lot
Thank you for this addon. Plugin and addon works like a charm.
I would suggest http://responsivemultimenu.com
Can this be integrated with Bootstrap?
Thank you, really. This is awesome.
thx dear <3 thx for share thx for share MIT. good luck
Thank you so very much for this addon. This is what I was scouring the web for. So grateful to you.
Tanks alot
Great menu component! Will there be support for Bootstrap 4?
No clue, I actually hope bootstrap 4 can do this natively!
Hey thanks for sharing this GitHub project. Seems to work well with bootstrap 3 styles, hopefully my style customisations are applied without too much trouble. You have saved me quite a bit of time, I was going to have to write this myself. :-)
This helped me a lot today, thank you so much!
Great job mate! You saved me. Thanks for having shared this.
This was a huge help. Thanks for posting this didn’t know anything about the Smartmenus but has made life easier with multi level integration with WordPress
I copied the same code in the demo for my sharepoint site but the nav bar doesnt collapse . What to do ?
I’m going to try this one. It looks like what I need for my site with categories and subcategories! Been fiddling around with other fixes for a day and a half now…thanks!
thanku thanku thanku so much.. you are great thanku