ブログテーマを変更した
- Dev
ブログテーマを Minimal Mistakes からオリジナルテーマに変更した。
きっかけは、最近まとまった文章を書いてないなと思い、久しぶりにブログを開いたことである。 なんともう2年も更新していなかった。
何か書こうかと思ったのだが、どうにもブログの見た目がごちゃごちゃしているのが気になってしまう。 ブログの見た目というのは、記事を書くモチベーションにとって非常に重要である。 そこで、記事を書く前にテーマを刷新することにした。
オリジナルテーマについて
以前のテーマである Minimal Mistakes は最も GitHub スターの多い Jekyll テーマだった。 しかし、2013年に作られたのもあって、それほど新しい感じはしない。 また、機能がとても多く、自分の用途にはオーバースペックに感じていた。
もっとシンプルなテーマはないかと探したが、都合のよいものは見つからなかった。 poole がもっとも理想に近かったものの、こちらは逆に拡張性がなさすぎた。
そこで、テーマを自作することにした。 方針は、とにかくメンテしやすいよう徹底的にシンプルにつくることである。
まず第一に、GitHub Pages でビルド・デプロイできるようにした。 こうすることで、ビルド・デプロイに関する一切のスクリプトを書く必要なく、git push するだけで記事を公開できる。 ただ、GitHub Pages は、Jekyll のビルドのみでフロントエンドのビルドは行ってくれない。 そこで、JS は用いず、CSS は CDN で配信されているものを使うことにした。 外部へ依存することになってしまうが、手軽さを重視するうえではそれほど悪くないと思っている。
CSS は Bootstrap と github-markdown-css を用いている。
github-markdown-css は記事部分のみに用い、追加で5行ほど自前の CSS を書いている。
本当は Bootstrap の $enable-responsive-font-sizes
の設定をいじりたかったが、CDN ではこれを true
にしたものの配信は行われていなかったので断念した。
Bootstrap 5 に期待したい。
Jekyll テーマとしての利用方法
このブログのテーマは gem にはしていないが、jekyll-remote-theme
を使うことで、一応 Jekyll テーマとして再利用できるようにしている。
はじめに適当な Jekyll プロジェクトをつくり、GitHub Pages の設定をしたリポジトリを origin に設定する。
$ jekyll new your-blog
$ cd your-blog
$ git init
$ git remote add origin https://github.com/you/your-blog.git
Gemfile
を以下のように書き換えて bundle install
する。
source "https://rubygems.org"
group :jekyll_plugins do
gem "github-pages"
gem "jekyll-octicons"
end
_config.yml
を以下のように書き換える。
author:
name: Your Name
url: https://example.com/
lang: ja-JP
google_analytics: UA-12345678-9
date_format: "%Y年%-m月%-d日"
remote_theme: sankichi92/blog.sankichi.net@fa7e637
plugins:
- jekyll-feed
- jekyll-remote-theme
- jekyll-seo-tag
最後に、コミットしてプッシュすれば、このブログのテーマが適用された GitHub Pages がビルド・デプロイされる。
ところで、いまこれを書いていて気づいたが、コードブロックのシンタックスハイライトには対応していない。
ライセンスについて
リニューアルを期に、すべての記事を CC-BY-4.0 で提供することにした。 Takahiro Miyoshi あるいは sankichi92 の名前と、記事へリンクを明記してもらえれば、自由に利用してもらってかまわない。