でろぐのロゴ 豚さんブーブー

Tumblr+GitHubPage+独自ドメインの形でお手軽にブログを作成の巻

2013年9月20日 (金)

今日は最近思いつきでやってみてやっぱりよかった感じの事を紹介しますよ。
ふにろぐの方で最近目次がはやっているのでこっちでも。

今回のもくじ

  1. 前提とコンセプトとか
  2. Tumblrで独自ドメインの設定
  3. GitHubPageにPush
  4. あとは微調整で完成

前提とコンセプトとか

まず前提として、あまり使っていなかったものを活用して自分用に手軽な形のメモブログを作ろうっていうのがあります。
というのも、発売が迫ってきているポケモンXYの自分用プレイメモのブログを作ろうっていうのが事の発端ですw
で、できる限り楽に更新したいのでありもののCMSっぽいものを使ってさくっと更新しやすいもの、かつiPhoneからも楽に投稿できるようにっていう感じのものがいいのです。
真っ先に思いついたのがWPですけど、もうWPはさんざん触っているので今回はちょっとご遠慮いただいて他のものにしようと。
で思い出したのがTumblr
リブログとして有名なあれです。
正直これまで全然使ってなくてアカウントとって放置でしたが、いい機会なので触ってみる事にしようと思いましてメインはTumblrで作る事に決定。
iPhoneアプリもあるので投稿も楽ですし、条件としてはクリアしています。
とここまではよかったんですけど、実際にやってみるとデザインのカスタマイズが少し癖あるというか、管理画面でしか変更できないっぽいので細かな変更があったらめんどいなって気づきました。
そこで、せめてCSSは外においてそれを読めばいいやんっていう事を思いまして、これまたあまり活躍していなかったGitHubPageを利用する事にしました。
HTMLはさすがに管理画面から変更しないといけないですが、テンプレの元になるhtmlもGitHubにバックアップでおいとけるので一石二鳥です。
ここに関しては後から考えたらAmazonS3でもいいかなって感じですね。
まあ好きな方を使えばいいんではないかと思います。
あと、さくっと作りたいのでベースはBootstrapで。
ロゴ的なものは好きなドータクンモチーフで絵を描いてみたかったので、Sketchで書いてみましたw
では以下技術的なお話。

Tumblrで独自ドメインの設定

まあさくっと作って公開するだけなのでTumblrのサブドメイン使えばよかったんですけど、せっかくの機会なのでTumblrに独自ドメインを当てて運用しようかなと思います。
適当なドメインを取得して、管理画面から設定をするだけで独自ドメインは設定完了。
これはマジで簡単でビビった。

Tumblrの画面
画面右上の設定からURLのとこの「独自ドメイン名を利用する」にチェックを入れて設定すると、Aレコードに設定するIPアドレスが出てくるので、それをドメイン側で設定すればおk。
多分ここはそんなつまづく事なくできると思いますよ。

GitHubPageにPush

次はCSSとか作業ファイルをごにょごにょして作ったら、GitHubにPush。
gitHubPageにする場合はリポジトリ作成後にブランチを「gh-pages」ってするだけ。
これだけでGitHubPageとして公開完了。
作ったディレクトリ名が自分のアカウント名のページの下にぶら下がる感じ。
今回の場合だとこんな感じ
http://deroter.github.io/poke/

実際作ったリポジトリがこれ

これで変更があったらCSSをごにょってPushすればサイトに反映されるのでらくちん。

あとは微調整で完成

こんだけできたらほぼ完成で、あとはTumblrのタグを調整したりでさくっと完成。
イラスト書くのに結構時間使ったけど、それ以外は多分2時間かかってない感じ。
Tumblrの場合は作るテンプレもHTML1ページ分でいいので、気楽にブログを作りたい(ある程度自分の好きな感じでっていうのはもちろん込みで)のであればこれは結構楽でいいい選択肢かなと思いますよ。

実際に作ったサイトがこちら
http://pokememo-xy.com/

短時間で作った割にはまあこましな感じにできたのではないかなと思いますw

シェアする