Blog

OctopressからHexoへの移行

ブログエンジンをOctopressからHexoへ移行しました。

この記事では自分の場合の移行の手順についてまとめます。

コンテンツデータの移行

記事や画像などのコンテンツデータの移行は、自分の場合はほぼこれだけでOKでした。

# 新しいhexoのルートディレクトリを作成
mkdir hexo
cd hexo
hexo init

# 投稿記事をコピー
cp -pr ../octopress/source/_posts/*.markdown source/_posts/

# 拡張子をmdに変更
for f in *.markdown; do echo mv $f ${f:r}.md; done | sh -x

# 投稿の先頭行(`---`)を削除
for f in source/_posts/*.md; do sed -i "" -e '1,1d' $f; done

# 画像をコピー
cp -pr ../octopress/source/images source/

# その他のファイルをコピー(CNAMEは独自ドメインの場合のみ)
cp -p ../octopress/public/{CNAME,favicon.ico} source/

ただし、Octopressの include に相当する機能はHexoには無いので、その記事についてはベタッとinclude先をコピーしました。

設定ファイルの編集(_config.yml)

従来の投稿のパーマリンク、および今後のパーマリンクの構造をOctopressと同じにするため、_config.yml で下記のように設定を変更しました。

permalink: blog/:year/:month/:day/:title/
new_post_name: :year-:month-:day-:title.md

デプロイ先はGitHubなので、下記の設定を追加しました。

deploy:
  type: git
  repo: [email protected]:kwhrtsk/kwhrtsk.github.io.git

テーマはしっくり来るものがなかったので、Landscapeをベースに自作したものを使っています。 見た目はほとんどLandscapeのままですが、特にモバイルでのコードの表示量や、サイドバーにAbout追加したり細かい修正を加えています。

これについては別の記事で。

技術ブログのためのHexoのテーマ Ingenuous をリリースしました

プラグインの追加

下記のプラグインを追加しました。

  • hexo-generator-feed
    • /atom.xmlの出力のため
  • hexo-generator-sitemap
    • /sitemap.xmlの出力のため
  • hexo-generator-robotstxt
    • /robots.txtの出力のため
  • hexo-deployer-git
    • GitHubへのデプロイのため
npm install --save         \
  hexo-generator-feed      \
  hexo-generator-sitemap   \
  hexo-generator-robotstxt \
  hexo-deployer-git

ここまでやれば、次のコマンドでローカルにサーバを立ち上げて、http://localhost:4000/ でプレビューを確認できます。 記事や_config.ymlの変更は随時反映されます。

hexo server

デプロイは下記のコマンドです。

hexo deploy

.deploy_git/ ディレクトリ以下にデプロイ用のリポジトリが作られて、 _config.ymlで指定したリポジトリにpushされます。(octopressのコミットはすべて消えます)