横あるき

変なことを書き綴るサイトです。

ブログをオレオレCMSからHugoに移行した

移行の経緯

前回の記事から半年経っていますね。何でこんなに間が空いたかを説明できるような納得感のある理由があるかといえば、ないです。

しいて言えば(やっぱりある)、3年前に作って使っていたシェルスクリプトなCMS、site.shでブログを管理していましたが、

  1. データと処理がごちゃごちゃでつらい
  2. 記事執筆用のオレオレフォーマットを拡張したくても面倒くさい
  3. シェルスクリプトで全部やろうとするのが良くないのでは?
  4. 他の言語だとかなり良さげなのが既にあるので作り直すのもな…

という堂々巡りを2年くらい前からやっており、微妙なsite.shの使い勝手の悪さで、記事を書くモチベーションが下がっていました。それで、この度ようやくHugoに移行する決心がついたというわけです。

Hugoを選んだ理由

  • site.shが完成しようかという時に初めて知った静的サイトジェネレータがHugoだった
  • 生成が早そう

という2点がメインです。Go言語が好きと言えるほど使ったことはないです。が、テンプレート処理が標準パッケージなところとか、ありものを組み合わせている感じがして好きです。1

Hugoでサイトを組んでみた印象としては、色々なやり方があって、ベストプラクティスっぽいものはなさそうだなあということです。それだけ作り方に幅があるのは良いことだと思いますが、どこから手を付けたら良いか迷いましたので、ポイントかなというのをいくつか紹介したいと思います。

Hugoでサイトを組んでいた時の気づき

ArchetypesSection Templatesの関係性

  • contentディレクトリ下の構成でSectionが定まる
  • archetypes/<section>.mdを作るとhugo newでSectionにあわせた雛形を作ってくれる
  • mdにtype: <section>で明示的に指定することもできる。(省略しても良い)

Base(Block)/Partial/Internal TemplatesとShortcodesの関係性

  • Base Templatesは{{ block }}にしたところを{{ define }}で書き換えられる
  • Partial Templatesはlayouts/partials/**.html{{ partial }}で使いまわせる
  • Internal Templatesはあらかじめ用意されたPartial Templatesみたいなもん
  • Internal Templatesをカスタムする場合はここをみてPartial Templatesにすればいい
  • 個人的には{{ block }}{{ define }}{{ partial }}はPugのextendsとblockincludesに似ていると思った
  • Shortcodesは記事の中で凝ったマークアップ構造を使いたい時に使う
  • Lookup Orderを見ながらテンプレートを配置すると良い

configの細かいところ

  • preserveTaxonomyNamestrueにしとかないと、タグの文字列がurlizeされる
  • hasCJKLanguagetrueにしとかないと、.Summaryがスペース区切りの単語数でカウントされて、RSSフィードのdescriptionとかめちゃ長くなる[^関連リンク3]
  • BlackfridayのplainIDAnchorsfalseにしとかないと、同じ文字列の見出しが2つあるとidが重複する

最近のHugo(0.32〜)は便利

  • 画像や動画をstaticに置かないといけなかったのが、<記事のディレクトリ>/index.mdで一緒に置けるようになった2
    • これは活用してる
  • 画像の最適化もしてくれるようになった
    • これは活用してない

Hugoに移行した結果

Markdownで記事が書けるようになったのは、前と比較したら良くなったかなと思います。勘違いしてほしくないのは、私はそんなにMarkdownが好きではないということです(面倒くさい人だ)。それでも、リストのネストが簡単に書けるようになったのは良かったですね。

それと同じくらい、Shortcodeが使えるようになったのも良かったです。site.shで記法を拡張したかったのは、任意のHTMLコードを使いまわせるようなところだったので。

今回移行するに当たってHugoのテーマも作成したので、参考になればさいわいです。

https://github.com/knokmki612/hugo-pencil-and-ruler

これで記事を書くペースが上がるといいなぁ…


  1. シェルスクリプトで頑張っていたからそう感じるのかねぇ…いや、シェルスクリプト的にはコマンドを活用すれば良くて、自分がそういう風にうまく書けなかっただけだな… [return]
  2. Hugo 0.32から記事と同じ場所に画像を置けるようになった - blog.ton-up.net [return]