静的サイトジェネレーターは Hugo を選びました

放置しているホームページですが Google Web Starter Kit で作った作成環境がとうとうエラーで起動しなくなりメンテナンス不能に陥りました。

一応、Static site generator に移行しやすいようにディレクトリ構成は昨年に見直していました。

kondoumh.hatenablog.com

Static site generator は golang 製の Hugo にしました。

gohugo.io

golang のツールらしく環境構築はバイナリダウンロードしてパスを通すだけとシンプルです*1し、生成に特化しているところもいいかなと思いました。生成自体も速いです。

Theme は色々試すのが面倒で、最初に知った Ananke でいいやってなりました。

themes.gohugo.io

Ananke ではデフォルトの OGP 情報は、config.toml の [params] に書いておけば Hugo の template に渡して生成してくれます。更新頻度を考えると RSS は不要かなということで disableKinds で生成を抑止しました。

baseURL = "https://kondoumh.com/"
languageCode = "ja-jp"
title = "kondoumh Home"
theme = "ananke"
   :
disableKinds = ["RSS"]

[params]
  description = "kondoumh home page. write about software I made."
  images = ["/images/mh.png"]
   :

OGP 情報を上書きしたい場合、ページのヘッダーに個別に埋め込めます。

---
title: "iEdit"
date: 2019-07-25T00:41:11+09:00
description: "iEdit : idea processor"
images: ["/images/iedit/iedit_icon.png"]
draft: false
---

layouts はあまりいじってませんが、_default/baseof.html をオーバーライドして、RSS のリンクを削除してます。Ananke のナビゲーションメニューは、content の構造をスキャンして生成してくれます。全部出るとウザいので partials/site-navigation.html をオーバーライドして固定メニューを出すようにしました。

Hugo には shortcode というテンプレート機能を使ったスニペットが用意されています。

Shortcodes | Hugo

これを使うと YouTube や Twitter のリッチなリンクは簡単に作れます。しかし、汎用的な外部リンク用の shortcode は提供されていません。ということで、はてなブログカードの API を使って iframe で表示したりしています。

とにかく、やっと Google Web Starter kit とお別れできて HTML 編集も不要になりました。Netlify で公開すればワークフローがシンプルになりますが、ドメインごと引っ越しするのも面倒なのでレンタルサーバにアップロードするスタイルは変わってません。

kondoumh.com

サイトのコードは GitHub で管理しています。

github.com

2019.8.24 追記)

Ananke theme のソーシャルアイコンにはてなブログと Tumblr が収録されていないので SVG データを持ってきて追加しました。

2019.11.4 追記)

サイトへの公開は GitHub Actions で自動化しました。軽微な修正なら localhost でサーバー起動してプレビューとかせずにコミットしちゃってます。

kondoumh.hatenablog.com

*1:Homebrew などでもインストールできます