JekyllからHugoへの移行ポイント

更新日:2022.07.02 作成日:2015.08.30
#jekyll #Hugo

Hugoが爆速であること、HugoがGolangで作られていて読みながら勉強したいという理由で、JekyllからHugoに移行した。

基本的には、_postディレクトリにあるものを、Hugoでいうcontent/postディレクトリに配置すればよい。テーマを指定せずに、Hugoとしても何も出力されないのでそこは注意すること。

JekyllからHugoへ移行する際にハマった点を残しておく。

日付フォーマットの変更

2015-08-30-post.markdown

---
title: "タイトル"
date: "2015-08-29T17:13:12+09:00"
---

jekyllだと、2015-08-30 10:30で認識していたが、Hugoで読み取る日付フォーマットは、以下の通り。

  • 2006-01-02T15:04:05Z07:00
  • 2006-01-02T15:04:05
  • Mon, 02 Jan 2006 15:04:05 -0700
  • Mon, 02 Jan 2006 15:04:05 MST
  • 02 Jan 06 15:04 -0700
  • 02 Jan 06 15:04 MST
  • Mon Jan _2 15:04:05 2006
  • Mon Jan _2 15:04:05 MST 2006
  • Mon Jan 02 15:04:05 -0700 2006
  • 2006-01-02 15:04:05Z07:00
  • 02 Jan 06 15:04 MST
  • 2006-01-02
  • 02 Jan 2006
  • 2006-01-02 15:04:05 -07:00
  • 2006-01-02 15:04:05 -0700

hugo newで作成されるのは、おそらく2006-01-02T15:04:05Z07:00の形式（実際には2015-08-29T17:13:12+09:00のようになる）のため、この形式に変換する必要がある。

別に、作成したときの秒まで管理する必要はなく、年月日だけでよいのであれば、2006-01-02とかでよいだろう。

ワンライナーで、変更する。

find . -type f | xargs gsed -i -e 's/date: \([0-9]\{4\}-[0-9]\{2\}-[0-9]\{2\}\) \([0-9]\{2\}:[0-9]\{2\}\).*$/date: \1T\2:00+09:00/g'

不要frontmatterの削除

layout:を削除する。

find . -type f | xargs gsed -i -e 's/layout:.*$//g'

日付をparseしている箇所

github.com/spf13/cast/caste.go

// StringToDate casts an empty interface to a time.Time.
func StringToDate(s string) (time.Time, error) {
	return parseDateWith(s, []string{
		time.RFC3339,
		"2006-01-02T15:04:05", // iso8601 without timezone
		time.RFC1123Z,
		time.RFC1123,
		time.RFC822Z,
		time.RFC822,
		time.ANSIC,
		time.UnixDate,
		time.RubyDate,
		"2006-01-02 15:04:05Z07:00",
		"02 Jan 06 15:04 MST",
		"2006-01-02",
		"02 Jan 2006",
		"2006-01-02 15:04:05 -07:00",
		"2006-01-02 15:04:05 -0700",
	})
}

func parseDateWith(s string, dates []string) (d time.Time, e error) {
	for _, dateType := range dates {
		if d, e = time.Parse(dateType, s); e == nil {
      fmt.Println(dateType)
			return
		}
	}
	return d, fmt.Errorf("Unable to parse date: %s", s)
}

time - The Go Programming Language

URLを決める

Jekyllのときは、https://www.meganii.com/blog/2015/08/30/title/のようなURL形式だったため、その形式に合わせる。

合わせ方は、config.ymlで定義する。

config.yml

---
baseurl: "https://www.meganii.com"
permalinks:
  post: "/blog/:year/:month/:day/:slug/"
---
permalinks:
  post: "/blog/:year/:month/:day/:slug/"

baseurlからみた、URL形式をpost:で定義する。

:slugは、frontmatterで定義しないと使えないため、以下のように、各記事にslugを埋め込む。

---
title: "マーケティング22の法則を図解してみた"
date: "2015-08-29T17:13:12+09:00"
category: ['Book']
tags: ['book','マーケティング']
slug: marketing-22-raws
---

自分は、 Swiftで初めてのMacOSXアプリケーション-FFViewer- - SIS Lab で作成したソフトを利用して、frontmatterを埋め込んでいった。

ファイル名から判断して、slugを決めるようにした。

テーマRobustを利用する上で直したポイント

Summaryにimgタグも含まれてしまう問題

\<!--more--\>だと、それ以前の文言を全て、Summaryとして扱う。その結果、Summaryに、imgタグが含まれてしまうため、デザインが崩れてしまった。

記事に含まれる<\!--more--\>を全て削除した。

Summaries

includeをshortcodeに変更

google adsenseなどをincludeしていたが、shortcodeに変更する。

layouts
└── shortcodes
    └── googleadsense.html

Shortcodes

ソースコードをインストール

Hugoでは、git, Mercurialが必要なためインストールする。

brew install mercurial
go get -v github.com/spf13/hugo

アップデートの場合は、以下のコマンドを実行するみたい。

go get -u -v github.com/spf13/hugo

タグとカテゴリの関係

Taxonomyあたりが関係している。

taxonomies:
  tag: "tags"
  category: "category"

上記の指定をすることで、いわゆるタグと、カテゴリに使用する名称を定義する。ここでは、タグをtags、カテゴリをcategoryとした。 （各記事のfrontmatterで利用している名称と一致させること）

http://gohugo.io/templates/terms/

tag,categoryのページを生成する際は、list.htmlが呼ばれる。

gsedのインストール

Macのsedは、挙動が違うらしいので、brew install gsedでインストールする。

課題

  • {% raw %}{% endraw %}が残っているため削除する
  • categoryとtagsのページレイアウトが仮のため、作成する（おそらくlist.htmlをいじればよい）
  • h2,h3に色を付けたい
  • imgをつけていく
  • 広告をつけていく
  • baseは、/blog/だから、categoryとtagsもそれに追随してほしい（直接Hugoのソースをみてみる）
  • デザインをフォークする

参考

Hugoで始める静的サイト構築入門　静的サイトジェネレーターで作る自作サイト (技術の泉シリーズ（NextPublishing）)
Hugoで始める静的サイト構築入門　静的サイトジェネレーターで作る自作サイト (技術の泉シリーズ（NextPublishing）)
インプレスR&D
AmazonKindle楽天市場Yahoo!ショッピング

Related contents