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

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

前記事はこちら.

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

設定方法

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

THEME = '（テーマ）'

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

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/

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

make html → make serve

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

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

Javascript
CSS
HTML + jinja2(Python謹製のテンプレートエンジン)

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

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

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

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

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

TOPから, イントロダクションにそえば簡単にできるはずです。できない場合はググる（・３・）

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

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

コメントプラグイン『DISQUS』で日本語が設定出来ない場合の対処

サーバ側に設定自体は存在するみたいなので, こんなトリッキーなことをせずとも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の知識が必須になってきますが, Pythonのテンプレートエンジンの中ではかなりメジャーですし, 抑えていて損は無いと思います。

追記

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

Pelicanの草稿機能を使ってみる