Pelicanにテーマを導入してみる


Python製静的ブログ生成ツールの'Pelican'でテーマを導入する方法と, テーマの紹介です。

前記事はこちら.

- [Pythonistaのための静的Blogエンジン'Pelican'とAmazon S3でブログを公開する方法](http://qiita.com/_rdtr/items/1fa617700b2100973569)

- [Python製静的ブログ生成ツール'Pelican'の各種設定](http://qiita.com/_rdtr/items/8052d2595825f8bc6c2b) 


[Pelican](http://blog.getpelican.com/)の導入が終わったら, やはり見た目に凝ってみたいんじゃないかと思います。[Pelican](http://blog.getpelican.com/)にはテーマ機能が付属していて, 自分の好きなテーマと入れ替え可能です。

### 設定方法
***
やり方はとても簡単で, 設定ファイル(pelicanconf.py)に

THEME = '（テーマ）'

みたいな感じで記述してやるだけです。
テーマについては有志の方が作成しているものがあって,

[https://github.com/getpelican/pelican-themes](https://github.com/getpelican/pelican-themes)

に全部置いてあります。
とりあえず上記のディレクトリをローカルにコピーしましょう。

	
	git clone --recursive https://github.com/getpelican/pelican-themes ~/pelican-themes

最後の ~/pelican-themes の部分は, テーマを配置したいディレクトリを自分で指定してください。これで全テーマがダウンロードされるので（多い！）、あとは使いたいテーマのディレクトリのPATHを

	
	THEME = "/home/user/pelican-themes/theme-name"

のように設定ファイルで指定してやるだけです。

[http://pelican-themes-gallery.place.org/](http://pelican-themes-gallery.place.org/)

でプレビューも確認できますので, よさ気なものを適用してみて,

make html → make serve

でローカルサーバで見た目を確認してみると良いでしょう。

このブログも（変わるかもしれませんが）[svbhack](http://giuliofidente.com/)というテーマをカスタマイズして使っています。落としたテーマも自分で編集できるので, 自由度は高いですね。
ごりごりカスタマイズしたり, テーマ自作してやるぜ！って場合は

* Javascript
* CSS
* HTML + [jinja2](http://jinja.pocoo.org/docs/)(Python謹製のテンプレートエンジン)

の知識が必須になってきます。

### カスタマイズの一例 - DISQUSのコメント機能との連携
***

pelicanにはコメント機能が無いので, 付けたい場合は[DISQUS](http://disqus.com/)などの外部サービスを導入する必要があります。

テーマによってデフォルトで付いてたり付いてなかったりして, svbhackのテーマもコメント機能が付いてなかったので, 付けてみました。

(1) DISQUSで自分のサイトを登録

[TOP](http://disqus.com/)から, イントロダクションにそえば簡単にできるはずです。できない場合はググる（・３・）


ここでshortnameというDISQUS側で自分のサイトを一意に特定する名前がもらえるはずなので, それをメモしておきます。

注）今のDISQUSの仕様だと使用言語「日本語」が選べなくなってます。
私も↓の記事を参考に直しました。

[コメントプラグイン『DISQUS』で日本語が設定出来ない場合の対処](http://aliceincyberland.co.jp/web/244)

サーバ側に設定自体は存在するみたいなので, こんなトリッキーなことをせずともDISQUS側が早く対応してくれると嬉しいかな。

(2) pelicanでDISQUSの設定を反映

quickstartコマンドでpelicanのブログプロジェクトを作っていれば,

publishconf.py

に以下のような記述があるはず。

```publishconf.py
# Following items are often useful when publishing

DISQUS_SITENAME = ""
```

ここに先ほどメモったshortnameを指定してやれば, とりあえずpelican側でDISQUSの設定反映は完了。


(3) htmlの編集

(2)までで良きにはからってくれるテーマもあるのですが, 対応してない場合は自力でDISQUSの呼び出しを記述する必要があります。

たとえばsvbhackのテーマの場合ですが,

/svbhack/templates

内に article.html というファイルがあって, こいつが記事を表示する際に使われているテンプレートになりますので, article閉じタグの直前に以下のように書けばOKです。

```article.html
	：
	：
	{% if DISQUS_SITENAME %}
    <div class="comments">
      <div id="disqus_thread"></div>
          <script type="text/javascript">
              var disqus_identifier = "{{ article.url }}";
              (function() {
                  var dsq = document.createElement('script');
                  dsq.type = 'text/javascript';
                  dsq.async = true;
                  dsq.src = 'http://{{ DISQUS_SITENAME }}.disqus.com/embed.js';
                  (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
          })();
          </script>
      </div>
    {% endif %}

    </div>
    </article>
```

 {% if DISQUS_SITENAME %} 〜 {% endif %} までが追記対象です。

DISQUS_SITENAMEが設定されていればコメントの埋め込みコードを埋め込みますということですね。

こうしてやれば本BlogのようにDISQUSのコメントが記事末尾に表示されるはずです！


Pelicanのテンプレートをいじるには[jinja2](http://jinja.pocoo.org/docs/)の知識が必須になってきますが, Pythonのテンプレートエンジンの中ではかなりメジャーですし, 抑えていて損は無いと思います。

### 追記
草稿機能について記載しました。

- [Pelicanの草稿機能を使ってみる](http://qiita.com/_rdtr/items/b7ac9a1dd061d81ed59a)