paginationプラグイン

概要

jekyllは基本的にpaginationプラグインを提供してますが、私たちはjekyll-paginate-v2を使っています。このブログはjekyll-paginate-v2の使用法について説明します。

プラグインのインストールや設定

jekyll-paginate-v2プラグインをインストールしてプレジェクトへ設定します。

プラグインのインストール

下記のコマンドでjekyll-paginate-v2のプラグインをインストールします。

gem install jekyll-paginate-v2

プラグインの設定

下記の設定内容を_config.ymlファイルへ作成します。

plugins:
  - jekyll-paginate-v2

permalink: /:year/:month/
pagination:
  enabled: true
  per_page: 12
  sort_reverse: true
  sort_field: 'date'
  title: ':title'
  trail:
    before: 2
    after: 2

permalink: ページの基本リンクです。このリンクがないとプラグインがうまく動作しません。
pagination: プラグインの設定オプションです。詳しく内容は公式サイトをご参考してください。(jekyll-paginate-v2:options)
enabled: プラグインを有効化します。
per_page: ページごとに表示するポスト数です。
sort_reverse: 逆整列をするかどうかを意味します。私たちは最近順でポストを表示するためtrueで設定します。
sort field: 整列する時使うフィールドです。私たちは最近順で表示するためdateフィールドを使ってます。
title: paginationで生成されたページのタイトルです。page.title変数に割り当てられる値を設定します。(ex> :title - page :num)
trail: 現在選択されたページの前・後へpaginationをどのぐらい表示するかを設定します。

ページ設定

ページへpaginationを表示するための設定です。paginationを持ってるページとpaginationから呼ばれるページ中に設定します。

paginationを持ってるページ

paginationを表示するためpaginationを持ってるページ(ex> categoryページ)へ下記のように設定します。

pagination:
  enabled: true
  category: 'jekyll'
  permalink: '/:num/

enabled: pagination機能を使います。
category: このカテゴリのポストをpaginationします。
permalink: pagination機能で生成されたページのリンクを設定します。(ex> /:num/)

paginationページから呼ばれるページ

呼ばれるページ(ex> postページ)へ下記のように設定します。

paginate_path: '/jekyll/:num/pagination-plugin/'

paginate_path: paginationから呼ばれる時ページの番号をリンクへ入れるための設定です。

参考

公式サイト: jekyll-paginate-v2
公式サイトのオプション説明: jekyll-paginate-v2:options

Github Sponsor

Buy me a coffee

私のブログが役に立ちましたか？下にコメントを残してください。それは私にとって大きな大きな力になります！

アプリ広報

今見てるブログを作成たDekuが開発したアプリを使ってみてください。
Dekuが開発したアプリはFlutterで開発されています。

興味がある方はアプリをダウンロードしてアプリを使ってくれると本当に助かります。

paginationプラグイン