WordPress疲れに苛まれた方々がスタティックサイトジェネレータに手を出していると聞き、私もこうしちゃいられない!ということで、Golang製スタティックサイトジェネレータのHugoを試してみることにしました。

で、ググってみるとGithub PagesやS3で運用する例が多く、さくらインターネットのレンタルサーバの事例が見つからないカンジ。 S3に移行したいなーという気持ちはあるものの、この前契約を更新したばっかりなのでもう少しさくらインターネットを使っていきたい!という事情があるので、今回はさくらインターネット(レンタルサーバ)でホスティングします。

なお、ビルド自体はローカル環境(mac)で行います。

WordPressからのエクスポート

https://github.com/SchumacherFM/wordpress-to-hugo-exporter を使って、エクスポートします。

ssh {user}@{ip_addr}
$ cd ~/www/wordpress/wp-content/plugins
$ git clone https://github.com/SchumacherFM/wordpress-to-hugo-exporter.git
$ cd wordpress-to-hugo-exporter
$ php hugo-export-cli.php ~/tmp/

デフォルトだと /tmp/wp-hugo.zip にエクスポートされて困るので、 引数に出力先ディレクトリを指定するのがポイント。

出力された~/tmp/wp-hugo.zipをローカル環境にダウンロード。

Hugoのインストール

$ brew install hugo

themeのダウンロード

Hugoはインストールしただけではデフォルトテーマも存在しない模様。 ここらへんからテーマを探す。

$ cd themes
$ git clone https://github.com/druzza/simple-hugo.git

私はhugo-simpleをベースに少し修正して使用しました。

themeの修正

config.yaml

configはtomlの他にもyamlとjsonで書くことができる。私はyaml派。 最終的なconfigは以下のようにした。

---
baseurl: http://yosiopp.net
languageCode: jp
title: yosiopp
config: config.yaml
metaDataFormat: yaml
verbose: true
theme: simple-hugo
params:
  shortDescription: なんか試したりした履歴
  useAnalytics: true
  googleAnalyticsId: UA-XXXXXXX-X
  twitter: yosiopp
  github: yosiopp
  links:
    applications:
      url: /applications/
      title: applications
---

archetypes/default.md

エントリを新規作成するときに利用されるテンプレートファイル。 使いたいfront matterとか入れとくと便利

---
draft: true
slug: yyyymmdd
categories:
  - ""
tags:
  - ""
---

こんな感じにした。

titledateはhugo newしたら勝手にfront matterに入る。

$ hugo new post/hoge.md
$ cat content/post/hoge.md
---
categories:
- ""
date: 2016-07-29T07:39:43+09:00
draft: true
slug: yyyymmdd
tags:
- ""
title: hoge
---

front matterの並び順が変わるのが気持ち悪い…。

テスト

$ hugo server -D

http://localhost:1313/で動作確認ができる。-Dオプションをつけるとdraft=trueのエントリも含めてビルドされる。

ビルド

$ hugo

publicディレクトリにファイルが出力される。

アップロード

ローカルでビルドしたファイルを送るならrsyncが楽ですかね。

$ rsync -acv --delete public/ -e ssh user@ip_addr:~/www/path/to/dir/

そんなかんじ。