LoginSignup
2
1

More than 3 years have passed since last update.

パンくず作ってみた[Ruby on rails]

Last updated at Posted at 2020-04-11

はじめに

ruby on railsのパンくず機能について簡単に投稿します。

パンくずとは

ユーザーが訪れたサイトのどの位置にいるのかをわかりやすく示した道しるべのようなものです。

↑サイトでよく見るこんな奴です。
これを実装するための手順について説明します。

①gretelの導入

パンくずを実装するためにgretelというgemを導入します。
はじめにgemfileにgretelを追加します

Gemfile
gem "gretel" ⬅️追加

gemを追加したらインストール

$ bundle install

続けて

$ rails g gretel:install

このコマンドによって下記のファイルが生成されます。
config/breadcrumbs.rb

②breadcrumbs.rbの記述

①で生成されたbreadcrumbs.rbにパンくずの記述を行います。

bread,crumbs.rb(記載例)
crumb :root do ⬅️親(一番最初のページ)
  link "トップページ", root_path
end

crumb :items do ⬅️子(親の次にくるページ)
  link "商品一覧", item_path
  parent :root
end

crumb :item do |item|
  link item.name, user_path(item)
  parent :items
end

記載方法としては

crumb :ページ名(任意の名前) do 

  link “実際に表示記述”, リンク先(path名)

  parent :ひとつ前のページ名(先頭ページでは不要)

end

という感じで記載していけばOKです。

③ビューへの表示

  - breadcrumb :パンくず名
  = breadcrumbs separator: " › "
※separatorは区切りの文字のことのようで、&rsaquoで › が表記されるようです

これで簡単にですがパンくずができました!

Screenshot from Gyazo

今回の実装は以上です。
ありがとうございました。

2
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
1