Skip to content

Renderer::Breadcrumbs

andi edited this page Aug 19, 2012 · 4 revisions

simple-navigation can also be used to display the current navigation as breadcrumbs. For example, consider this navigation:

SimpleNavigation::Configuration.run do |navigation|  
  navigation.items do |primary|
    primary.item :books, 'Books', books_path do |books|
      books.item :fiction, 'Fiction', fiction_books_path
      books.item :history, 'History', history_books_path
      books.item :sports, 'Sports', sports_books_path
    end
    primary.item :music, 'Music', musics_path
    primary.item :dvds, 'Dvds', dvds_path
  end
end

When rendered as breadcrumbs and the second level item :sports is active, the breadcrumbs renderer outputs the active primary navigation and the active subnavigation as links concatenated with a customizable character, i.e.:

Books > Sports

You can pass the following options to render_navigation when using the breadcrumbs renderer:

  • :renderer – set to :breadcrumbs to use the breadcrumbs renderer
  • :join_with – to specify the character or string which should be used to join your breadcrumbs. Defaults to a space. If you change this option, do not forget to also specify the whitespace around your join character, e.g. :join_with => " > ". It’s safer to use escaped html characters when using special characters. You could even consider to escape the whitespace (:join_with => “ > ”).
  • :static_leaf – set to true to specify that the deepest item within the current navigation hierarchy should be rendered as static text rather than as a link. Defaults to false. (Available from v3.7.0.)
  • :prefix – Use prefix to render text or html before the breadcrumbs itself. Prefix will not be rendered if there are not breadcrumbs.

For the example above the call:

render_navigation :renderer => :breadcrumbs, :join_with => " > "

would generate the output:

<div>
  <a id="books" href="/books">Books</a> &gt; <a id="sports" href="/books/sports">Sports</a>
</div>

By default, the renderer sets the item’s key as dom_id for the rendered link element unless the config option autogenerate_item_ids is set to false. The ItemContainer’s dom_class and dom_id are applied to the surrounding div element.

Clone this wiki locally