[2009-05-23-1] のように、時々ソースコードを貼り付けることがあります
が、色が付かなくて寂しかったので google-code-prettify で色を付ける
ようにしてみました。chalow 以外のブログにも使えると思います。

[src]〜[/src] で囲まれたソースの言語を自動判別して、適切
に色付けしてくれます。

  1. http://code.google.com/p/google-code-prettify/ から、
    “prettify-small-日付.zip” をダウンロードします。(“prettify-日付.zip”
    は *.js が圧縮されていません。こだわりがなければ small の方をダウン
    ロードすればよいでしょう。)

  2. 解凍してできる *.css と *.js をご自分の Web スペースにアップしま
    す。今回は http://masutaka.net/prettify/ にアップしました。以下、こ
    の状態を前提に話を進めます。

  3. お使いの CSS に、以下を追加します。
    @import url(http://masutaka.net/prettify/prettify.css);

  4. cl.conf を修正します。全ての の直前に、以下を挿入すれば
    よいでしょう。

<script type="text/javascript" src="http://masutaka.net/prettify/prettify.js"></script>
<script>prettyPrint();</script>

※ 私は $side_menu を全てのページで表示するようにしているので、その
先頭に 1 つだけ追加しました。

  1. chalow を修正します。以下はオリジナル(chalow-1.0.tar.gz)の
    chalow へのパッチです。
--- orig/chalow-1.0/chalow	2007-10-19 23:15:01.000000000 +0900
+++ chalow-1.0/chalow	2009-05-23 23:35:24.000000000 +0900
@@ -1313,7 +1313,7 @@
     $$strp =~ s|\x7\x13(\d+)\x3|eval($escaped_plugin{$1})|ge;
     ### ソースアンエスケープ - pre 追加
     #$$strp =~ s|\x6\x13(\d+)\x3|<pre>$escaped_src{$1}</pre>|g;
-    $$strp =~ s|\x6\x13(\d+)\x3|</p><pre>$escaped_src{$1}</pre><p>|g;
+    $$strp =~ s|\x6\x13(\d+)\x3|</p><pre class="prettyprint">$escaped_src{$1}</pre><p>|g;
     ### HTML アンエスケープ
     $$strp =~ s|\x5\x13(\d+)\x3|$escaped_string{$1}|g;
 }

chalow を実行してサイトを構築し直せば、ソースコードに色が付いて
いると思います。

リリース元の解説 はもちろん参考になりましたが、それ以上に
「404 Blog Not Found:javascript+CSS - google-code-prettifyの導入 」
が大変参考になりました。ありがとうございます。

ただ、Lisp 系のソースの色付けがうまくいきません。長くなるので、次の
記事 [2009-05-24-2] で説明します。

google-code-prettify の他に、Text::VimColor を使う方法 もあるようで
す。ただ、さくらインタネットには vim がインストールされていなかった
ので、今回は試しませんでした。