camuro

WordPressからmiddlemanに移行してGithub Pagesで運用する方法

サイトをリニューアルしていました。 WordPressからmiddleman-blogに乗り換えました。 ホスティングもロリポップからgithub-pagesに乗り換え。 理由は普段使っているエディタでmarkdownでブログを書いてgitでデプロイする流れがやりたかったから。 static site generatorは数あれど、慣れたmiddlemanでやってしまおうと思っていました。 haml と sassでコーディングしています。コードはここに置いてあります→camuro.github.io

今回リニューアルするのにとった流れか下記の通りです。

  1. WordPressからデータをmarkdown形式でブッコ抜く
  2. Pureを少し使ってmiddleman-blogでコーディング
  3. githubにorganizationアカウントを作る
  4. middleman-deployでdeploy
  5. トップレベルドメイン(TLD)でDNSの変更

1. WordPressからデータをmarkdown形式でブッコ抜く

WordPressからxmlをexportしておく。 Octopress - WordPress から投稿データを移行！ の記事を参考にWpXml2Mdを使ってxmlからmarkdownにコンバートする。 wp-content/uploads/の画像をsource/images/にコピーする。 表示おかしいところなどを確認して直す。

正直、syntax-hilighterの調整で戸惑ったので、もっといい方法があるはず。 jekyllとかoctpressの記事を調べてもっと良い方法探した方がいいかも。

2. Pureを少し使ってmiddleman-blogでコーディング

グリッドとページングのところにPureを使いました。@yterajimaさんのgemが便利です。 markdownはmiddleman-syntaxでredcarpet、Syntax-Hilightはmiddleman-rouge、コメントはmiddleman-disqusのgemを使いました。

3. githubにorganizationアカウントを作る

ドメインを割り当てたい場合の対策です。 ユーザーアカウントにプロジェクトリポジトリを作成した場合は、masterブランチをdeployするとgh-pagesブランチが生成されてそこにbuildしたファイルがdeployされます。 http://username.github.io/projectnameでgh-pagesブランチのファイルが表示されるはずです。 ドメインを割り当てる場合は、username.github.ioという名前でリポジトリを作成してそこにドメインを書いたCNAMEファイルを置きます。（置き場所はsource/の下です。） github pagesのカスタムドメインは1ユーザにつき1つしか設定できないので、自分の場合はcamuro.org用にcamuroというorganizationアカウントを作りました。 そしてorganizationアカウントで新しいリポジトリをcamuro.github.ioという名前で作成します。 camuro/camuro.github.ioという感じですね。

4. middleman-deployでdeploy

（deployする前に、$ middleman buildしておいてくださいね。） 以前書いていたのですが、公開してなかった記事があったのでついでに公開します。 Middleman 実践（4）- Githubページへデプロイする方法 上記の記事の方法はdeploy.branchを指定しないと自動的にgh-pagesというブランチで生成されますが、ドメインを割り当てたい場合にはgh-pagesにCNAMEを置いても反映されず、あくまでmasterブランチでないと反映されません。 なので、config.rbに次のように設定しておきます。

activate :deploy do |deploy|
  deploy.method = :git
  deploy.branch = 'master'
end

これで、$ middleman deployしてあげるとmasterブランチにdeployされます。 まぎらわしいので本来のmasterブランチ的な役割はdevelopというブランチ名で作りました。 Coiney開発者ブログを参考にしました。（coiney.github.io）。

トップレベルドメイン(TLD)でDNSの変更

独自ドメインの取得先で DNS を設定します。 DNS で camuro.org の Aレコードを 204.232.175.78 にセットします。 セットした後にターミナルで確認します。

dig camuro.org +nostats +nocomments +nocmd

反映されていたらこんな感じで表示されるはずです。

; <<>> DiG 9.8.5-P1 <<>> camuro.org +nostats +nocomments +nocmd
;; global options: +cmd
;camuro.org.      IN  A
camuro.org.   3600  IN  A 204.232.175.78

これで、camuro.orgにアクセスしたらGithub Pagesに飛ぶようになります。 以上です！

comments powered by Disqus