No release in over 3 years
Low commit activity in last 3 years
simple-navigation-bootstrap is a simple-navigation renderer for twitter-bootstrap navigation and dropdowns.
2005
2006
2007
2008
2009
2010
2011
2012
2013
2014
2015
2016
2017
2018
2019
2020
2021
2022
2023
2024
 Dependencies

Development

>= 0

Runtime

>= 3.1
< 4.0.0, >= 3.7.0
 Project Readme

Simple Navigation for Bootstrap

This gem adds a renderer for Simple Navigation to output markup compatible with Twitter Bootstrap.

MAINTAINER WANTED: Whilst this likely works as is, I don't do much Rails work these days, so I'd be happy to hand this over to someone if they'd like to take over maintenance

Getting Started

For Rails >= 3, simply add this gem to your Gemfile:

gem 'simple-navigation-bootstrap'

and run

bundle install

Follow the configuration instructions on the Simple Navigation wiki for initial configuration.

To use the Bootstrap renderer, specify it in your view:

render_navigation :expand_all => true, :renderer => :bootstrap

And the minimal navigation config you need is:

SimpleNavigation::Configuration.run do |navigation|  
  navigation.items do |primary|
    primary.dom_class = 'nav'
  end
end

See below for a more complete example.

Additional Functionality

Icons

In addition to generating Bootstrap-comptible list markup, you may specify an :icon attribute on your navigation items, either as an array or string, containing Bootstrap icon classes, to add an icon to the item.

Split navigation

For items with sub-navigation, you may specify :split => true on an item to enable a split dropdown. Split dropdowns allow using an url on the primary navigation item, as well as having a dropdown containing sub-navigation. If you plan on using this feature, in your application.css or equivalent you must require the bootstrap_navbar_split_dropdowns stylesheet after requiring Bootstrap.

For example:

/*
*= require bootstrap_and_overrides
*= require bootstrap_navbar_split_dropdowns
*/

You may also enable split navigation for all children by setting the split attribute of the container to true (defaults to false).

Dropdowns

If you wish to disable dropdown attributes for some reason (eg -you don't use the JavaScript, or have custom handling), you may specify :dropdown => false on an item, or set the dropdown attribute on the container to false (defaults to true).

Examples

To create a navigation menu, you might do something like this:

SimpleNavigation::Configuration.run do |navigation|  
  navigation.items do |primary|
    primary.item :music, 'Music', musics_path
    primary.item :dvds, 'Dvds', dvds_path, :split => true do |dvds|
      dvds.item :action, 'Action', dvds_action_path
      dvds.item :drama, 'Drama', dvds_drama_path
    end
    primary.item :books, 'Books', :icon => ['icon-book', 'icon-white'] do |books|
      books.item :fiction, 'Fiction', books_fiction_path
      books.item :history, 'History', books_history_path
    end
    primary.dom_class = 'nav'
    primary.dropdown = true
    primary.split = false
  end
end

Caveats

Requires Bootstrap version >= 2.1.0

Further Reading

TODO

So far, only nav markup and dropdowns are supported, may also implement buttons and nav lists in the future. And tests, there are currently no tests.