Install ghost on CentOS6.x

はじめに

技術Blogを書くのなら、個人でBlogサイトを運営するよりも既存のブログ・サービスの方を選択すべきかもしれません。既存コミュニティの持つ力、データの永続性、各種支援機能を考えるとやはり優れている点が多いと思います。

が、今回はBlogを再開するにあたってブログ・プラットフォームの ghost を利用することにしました。理由は下記のような感じで好みの判断です。

  • 契約はしているが、ほとんど使っていないVPSの存在...orz
  • ブログエンジンを一度動かしてみたかった
  • シンプルで使いやすそうなUIでテンションが上った

ということで、このblogはghostで動いています。blog構築までの流れをまとめてみます。

やったこと

基本的に公式の installation に沿って構築しました。大きなハマりどころは特にありませんでした。

  • nodeのインストール
  • ghostのインストール
  • pm2による永続化
  • 起動スクリプトの作成・設定
  • nginxの設定
  • コメント・サービスの追加 (Disqus)
  • syntax highlight

nodeのインストール

sudo curl https://raw.github.com/hokaccha/nodebrew/master/nodebrew | perl - setup  
echo 'export PATH=$HOME/.nodebrew/current/bin:$PATH' >> ~/.zshrc  
source ~/.zshrc

nodebrew ls-all  
nodebrew install stable  
nodebrew use v0.10.29  

ghostのインストール

curl -L https://ghost.org/zip/ghost-latest.zip -o ghost.zip  
unzip -uo ghost.zip -d ghost  
sudo mv ghost /var/www/ghost

sudo useradd -r ghost -U  
sudo chown -R ghost:ghost /var/www/ghost  
sudo usermod -G wheel,ghost itomoyasu

cd /var/www/ghost  
npm install --production  
npm start  
# access to http://localhost:2368

pm2による永続化
Node.jsでプロセス管理をしてくれる良いmoduleを探していたら、pm2が良さそうだったので採用しました。インストール方法は https://github.com/Unitech/pm2 を参考にしました。

npm install pm2 -g  
NODE_ENV=production pm2 start index.js --name "Ghost"  
pm2 save  

起動スクリプトの作成・設定

sudo env PATH=$PATH:/home/itomoyasu/.nodebrew/node/v0.10.29/bin pm2 startup centos -u itomoyasu

sudo chmod +x /etc/init.d/pm2-init.sh  
sudo chkconfig --add pm2-init.sh  
sudo chkconfig pm2-init.sh on  

nginxの設定

cat /etc/nginx/conf.d/ghost.conf  
server {  
    listen      80;
    server_name blog.itomoyasu.com;

    location / {
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header Host      $http_host;
        proxy_pass      http://127.0.0.1:2368;
    }
}

cat /etc/nginx/conf.d/default.conf  
server {  
    listen       *:80;
    server_name  itomoyasu.com;
    return 301 $scheme://blog.itomoyasu.com$request_uri;
}

sudo /etc/init.d/nginx restart  

コメント・サービスの追加 (Disqus)
http://87studios.net/add-comments-ghost/ を参考にしました。Google+ や Facebookに比べるとDisqusが好みだったので、Disqusを入れました。

universal_code.png - 生成されたhtmlタグを /var/www/ghost/content/themes/casper/post.hbs に埋め込む

  # footer辺りに入れるのが良さそう
  <section class="disqus">
      <div id="disqus_thread"></div>
      <script type="text/javascript">
      ...
      </script>
  </section>
  • 既存のShare用SectionがDisqusのものと被ったので削除
  <section class="share">
      <h4>Share this post</h4>
      <a class="icon-twitter" href="https://twitter.com/share?text={{encode title}}&amp;url={{url absolute="true"}}"
          onclick="window.open(this.href, 'twitter-share', 'width=550,height=235');return false;">
          <span class="hidden">Twitter</span>
      </a>
      <a class="icon-facebook" href="https://www.facebook.com/sharer/sharer.php?u={{url absolute="true"}}"
          onclick="window.open(this.href, 'facebook-share','width=580,height=296');return false;">
          <span class="hidden">Facebook</span>
      </a>
      <a class="icon-google-plus" href="https://plus.google.com/share?url={{url absolute="true"}}"
         onclick="window.open(this.href, 'google-plus-share', 'width=490,height=530');return false;">
          <span class="hidden">Google+</span>
      </a>
  </section>

syntax highlight

この記事を書いていてコードブロックが残念だっため、syntax highlight用にprism.jsを入れました。 http://blog.davebalmer.com/adding-syntax-highlighting-to-ghost/ を参考にしました。
こちらもDisqusのタグを埋め込む要領で追加できます。


これでしばらくはblogを書くことに困らなそうです。困ったことが出てきたり、いい感じのthemeが見つかったら手を出そうかと思います。

Tomoyasu Ishikawa

Read more posts by this author.