Breadcrumb trail implementation

Introduction

I've implemented a breadcrumb feature to make it easier to see at a glance which page the user is accessing, so I'll post it here. This time, I implemented it using ** gretel (Gem that displays the list with links) **.

1. Introduction of Gem and file creation

** 1. Write gretel in Gemfile and bundle install.

Gemfile


gem 'gretel'

Terminal


% bundle install

** 2. Create a file that describes the parent-child relationship of the breadcrumb trail. ** **

Terminal


% rails g gretel:install

This will create config / breadcrumbs.rb.

2. Breadcrumb trail Parent-child relationship description

** Write the code in breadcrumbs.rb created in 1 **

config/breadcrumbs.rb


crumb "Page name when calling with view" do
  link "List display name", "Path of page to access"
  parent :Previous page name
end

config/breadcrumbs.rb


crumb :root do
  link "top page", root_path
end

crumb :new_idea do
  link "New idea post", new_idea_path
  parent :root
end

crumb :idea_show do |idea|
  link "Idea details", idea_path(idea.id)
  parent :root
end

crumb :edit_idea do |idea|
  link "Idea editing", edit_idea_path
  parent :idea_show,idea
end
#Omission

3. Call with view

** Call the parent-child relationship created in 2 to view. ** **

html:views/ideas/show.html.erb


<% breadcrumb :idea_show ,@idea%>         <!--Describe the breadcrumbs you want to call-->
<%= breadcrumbs separator: " &rsaquo; " %>  <!--The delimiter between breadcrumbs ">Indicates-->

Implementation is complete for the time being! !! !! The rest is like CSS.

Finally

The breadcrumb function I implemented is used for all sites and apps, so this implementation was a learning experience. I would like to use it if there is an opportunity to utilize it.

Recommended Posts

Breadcrumb trail implementation
[Rails] Make a breadcrumb trail
[Rails] Show multi-level categories in the breadcrumb trail
[Rails] Creating a breadcrumb trail using Gem gretel