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

2159 ワード
初心者 Ruby Rails Ruby テキストリンク

はじめに

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で　›　が表記されるようです

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

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

一歩一歩avalonコンポーネント05を作成する:ツリーコンポーネント
ゼロからの反応自動補完コンポーネントの構築