DEV Community

matt swanson
matt swanson

Posted on • Originally published at on

Boring breadcrumbs for Rails

Breadcrumbs are a common UI pattern in most software applications. Rails has no built-in tools specifically for breadcrumbs, and while there are a handful of existing gems, I think this is something you can easily implement in your own app with just a few lines of code.

Ultimately, you’ll want control of how you display the breadcrumbs in your app so you might as well just own all the code for this functionality.


First, add a model for a Breadcrumb. This can live in the app/models folder but does not need to be an ActiveRecord model since we don’t need it to persist to the database.

class Breadcrumb
  attr_reader :name, :path

  def initialize(name, path)
    @name = name
    @path = path

  def link?
Enter fullscreen mode Exit fullscreen mode

Next add a method to your ApplicationController to store and add breadcrumbs.

class ApplicationController < ActionController::Base

  helper_method :breadcrumbs

  def breadcrumbs
    @breadcrumbs ||= []

  def add_breadcrumb(name, path = nil)
    breadcrumbs <<, path)
Enter fullscreen mode Exit fullscreen mode

Then in your layout, you can render the breadcrumbs however you’d like. In my applications, I use the breadcrumbs in both the <title> head tag and in the page header.

    <%="My App").join(" | ") %>

  <ol class="breadcrumbs">
    <% breadcrumbs.each do |crumb| %>
      <% if %>
        <%= link_to, crumb.path, class: "breadcrumb-link" %>
      <% else %>
        <span class="breadcrumb-page">
          <%= %>
      <% end %>

      <% unless crumb == breadcrumbs.last %>
        <span class="breadcrumb-separator">/</span>
      <% end %>
    <% end %>
Enter fullscreen mode Exit fullscreen mode

It’s a simple API, but this model will allow you to add breadcrumbs in each of your controllers. The breadcrumb can include an optional path if you want it to be a link.

You can setup breadcrumbs in before_actions or inside each action. You can add conditional logic just like with any regular Ruby code.

class PostsController < ApplicationController
  before_action :set_breadcrumbs

  def index
    @posts = Post.all

  def show
    @post = Post.find(params[:id])

    add_breadcrumb(@post.title, @post)

  def new
    @post =

    add_breadcrumb("New Post")


  def set_breadcrumbs
    add_breadcrumb("Admin", admin_home_path) if Current.user.admin?
    add_breadcrumb("Posts", posts_path)
Enter fullscreen mode Exit fullscreen mode

Sexy? No. Boring? Yes. Works great? Of course.

Top comments (0)