I've been working on a Magento theme for an eCommerce project �and I wanted a solid Bootstrap 3 boilerplate theme to build my project and future Magento themes on.
Theres a lot of jQuery hacks out there to get the job done but I wanted to do it the right way.
So heres how you can quickly and easily add a Bootstrap Navigation Bar into your Magento theme.
Note: This method will only work for Magento v 1.7+�
The code that outputs the HTML for the navigation bar in Magento is located in�app/code/core/Mage/Page/Block/Html/Topmenu.php
You want to create a module to extend the�MagePageBlockHtmlTopmenu class. If you're not sure how to do this take a look at�http://www.magentocommerce.com/boards/viewthread/280715/
This code overrides the core navigation output and adds in classes and attributes that your website needs to render the Bootstrap menu.
Please note that by default the Bootstrap navigation only displays one level of children so if you want to show more you will have to make more customizations...
One more thing that I do for my Bootstrap menu is change it from click to dropdown to hover. I think this is especially important for a Magento website where you probably want your users to be able to click the parent category and be directed to the page displaying the products and sub categories. Just include this plugin in your project https://github.com/CWSpear/bootstrap-hover-dropdown and in the Topmenu.php just change data-toggle to data-hover.
Please drop a comment if you need any help and I will post my Magento Bootstrap Boilerplate once I'm done with it.
