Renderer::Breadcrumbs

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 ' '). 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 - uses 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.