Jekyllテーマの変更

Blog

あまり記事を書くことなく細々とこのBlogを続けている(正確には放置しているとも言う)のであるが、今使っているシステムのCコンパイラをアップデートしたら、Blogを生成しているツール群がアップデートできなくなってしまった。(使い続けることはできて問題はあまりないのだが、レガシーなものに頼っていると本当に環境を変更するときにとてつもなく大変な状況(前回の環境変更がそうだった)になるので、適当に変更に取り掛かることにした。

前回の変更は2014年11月30日だったので、静的サイトジェネレーターに切り替えてなんだかんだまる5年くらいになるのだが、大きな問題は先に書いた通りRuby関係のライブラリの依存性で、必要とされるもののコンパイルでよく失敗するところが管理上疲れるところで、それ以外は大きな問題はない。backendのRDBの面倒を見なくてよくなったせいか気は楽である。

今回の作業の要点は

  • Ruby 2.6辺りに移行
  • Jekyllの最新に追従
  • テーマをRubyGemで配布されているものに変更
    • テンプレート関係も別途レポジトリを作って管理する
    • 複数の環境での作業や同期を楽にしたい

と言うところか・・・ Jekyllテーマはここ数年はHPSTRを使っていたのだが、TagやCategoryをFront Matterに記述していてもCategoryが有意に使われていなかった。(移行した時にテーマを何使っていたか忘れちゃったが、当時はTagも Categoryも有効だった。) 今回は、同じ作者のMinimal Mistakesに切り替えてみた。切り替えてみて、何年か前にやればよかったじゃないかとは思ったが・・・

と言うことで、大雑把にこんな感じに進めてみた。まずGemfileに

source "https://rubygems.org"
gem "minimal-mistakes-jekyll"
# If you have any plugins, put them here!
group :jekyll_plugins do
  gem "jekyll-archives"
  end
gem 'gemoji’

と書いて、

% bundle install --path vendor/bundle

でインストールする。うちの環境はしょっちゅうアップデート時に何かがアップデートできなくてハマることがあるので、基本的にはbundlerを使ってインストールする。いちいちbundleのサブコマンドを入力しないといかんのが面倒ではあるが、動く環境壊すと本当に大変なので。
次にminimal-mistakes-jekyllがどこにインストールされたを以下のようにして調べる。

% bundle info minimal-mistakes-jekyll
bundle info minimal-mistakes-jekyll
  * minimal-mistakes-jekyll (4.17.2)
          Summary: A flexible two-column Jekyll theme.
          Homepage: https://github.com/mmistakes/minimal-mistakes
          Path: /home/kentaro/src/blog/vendor/bundle/ruby/2.6.0/gems/minimal-mistakes-jekyll-4.17.2

ここから、以下のファイル・ディレクトリをコピーしてくる。

.
├── _data
│   └── navigation.yml
├── _includes/
├── _layouts/
├── _sass/	
├── assets/
│   ├── css
│   ├── images
│   └── js
├── Gemfile
├── Gemfile.lock
├── _config.yml
└── index.html

./_config.yml と ./index.htmlは直接もらってくる。

% wget https://raw.githubusercontent.com/mmistakes/minimal-mistakes/4.17.2/_config.yml
% wget https://raw.githubusercontent.com/mmistakes/minimal-mistakes/4.17.2/index.html

あとは./_pages/ (固定ページ群)、./_posts/ (これまでの記事)、./_images/ (これまでの写真など)、./_gallery/ (写真のギャラリー)などを配置すればいいのだが、これらは別レポジトリを作ってで管理しているので、適当なディレクトリにすでにおいてあるため、上記の ./ 以下にシンボリックリンクを張れば、いったん基本的な作業は終了である。ここまで作業すると、

% bundle exec jekyll server

でいったん詳細設定を始める前のWebサイトにアクセスできる。あとはひたすら設定であるが、うちの場合は、

  • サイト名などの基本的な設定
  • Adobe Fontを使っているので、head要素の中で読み込むように設定
  • ./_sass/minimal-mistakes/_variables.scssでフォントを設定
  • ./_pages/ 内に生成するファイル(Aboutや404ページや・・・)を作成

をした結果、このようなページになった。もう少し設定するところはあるが、いったんここで公開できると言うことで、切り替えとなった。まあこの辺の細かい設定は、Minimal MistakesのQuick-Start Guideからそれぞれのドキュメントを読んでいけばいいだけなので、そちらを参照。