YAMM3 – Build Megamenu For Bootstrap 3

There are many usability advantages in using megamenu on a webpage. With megamenu, you can take full control over your menu. Almost all web elements can be assigned there. Some great companies have even applied megamenu into their website. Amazon and Mashable for example. Amazon have an image background in their menu and Mashable uses image thumbnails for a more attractive menu.

If you have been working with Bootstrap, now you can build a megamenu in a snap with this brand new library called Yamm from Geedmo.

Yamm3 (Yet Another Megamenu) is a CSS library to help you build a megamenu in Bootstrap 3 easily. The megamenu works for both responsive and fixed layouts. It covers almost all bootstrap elements to be included in the navbar like picture, accordion, list, grid, table, form and so on.

Please note that we use Bootstrap 3 here and the minimum jQuery version required is version 1.9.0+. If you are still running on the previous Bootstrap version, we recommend following the guide of the previous Yamm version.

HTML Markup

In basic usage, to use Yamm3 firstly add .yamm class at the top of the navbar markup. Then, you can add your menu markup into the .dropdown-menu class. The following is a basic example.

By calling the accordion id and using a panel-group class for grouping, you are able to create an accordion inside the navbar. And so our menu will look like the screenshot below:

There are plenty of other components you can add into the navbar. Self exploration of other components you can implement can be done if you download the Yamm3 complete archive and open the index.html file with your favourite code editor.

Javascript

There is an additional javascript code used for the prevention of an unexpected closed menu in some components like accordion, forms, etc. Just include the following code into your head or body section:

Conclusion

Yamm3 is another great third-party product to boost your Twitter Bootstrap’s development when building an attractive navbar. You just need a little effort in exploring all implementation components, as it lacks documentation support for creating various components menu.