初めに
前回はページネーションの実装について投稿しましたが今回はレイアウトについて投稿していきます。
すでに'kaminari'をGemfileに入れている方は 新たに'bootstrap4-kaminari-views'を入れてviewページの記述の所を見て貰って構いません。
まだ、'kaminari'をGemfileに入れていない場合は上から順にやって頂けたら幸いです。
Gemfile
まずGemfileに
gem 'kaminari','~> 1.2.1'
gem 'bootstrap4-kaminari-views'
上記の記述を入れてあげます。
記述をしたら忘れずに
bundle install
をしましょう。
bundle installをしたら次にkaminariの設定ファイルを作成する為に下記のコマンドをターミナルに打ち込みます。
$ rails g kaminari:config
最後に、kaminariが利用するテンプレートを作成してあげます。
$ rails g kaminari:views default
これで準備は完了です。
次にControllerに記述
例としてindexで記述しています。
def index
@books = Book.page(params[:page]).per(9)
end
上記のようにpage(params[:page]).per(9)を付け足してあげます。
補足でper(9)は何を意味しているかと言うと、per(1ページで表示したい件数)と言うことになります。
自分自身で表示したい件数を決めて頂けたら結構です。
次にViewに記述
〜省略〜
<% if book.image.attached? %>
<%= image_tag book.image, size:"200x120" %>
<% end %>
<%= book.title %>
</div>
<%= paginate @books, theme: 'twitter-bootstrap-4' %>
</div>
上記のように表示させたいviewの所に<%= paginate @books, theme: 'twitter-bootstrap-4' %>を入れてあげる事により下記の写真のようにレイアウトが出来ると思います。
日本語設定については別途に投稿してあるので是非参考にしてみて下さい。