Google Code Prettify

ダウンロード

プラグインファイルをダウンロードします。Minified source files と Source code がありますが、どちらでもOKです。しかし、prototype.js を導入している場合に、Minified source files では不具合が発生することがありました。その場合、Source code を試してみてください。

インストール

zip ファイルを解凍してできた prettify.css と prettify.js を、ブログのルートディレクトリ（サイトURL）にアップロードします。

テンプレートの編集

テンプレートモジュールにある [HTMLヘッダー] に下記コードを追加します。このコードでは、<pre> タグに prettyprint クラスを自動設定します。よって、過去の記事を修正する必要がありません。

<script type="text/javascript" src="<$mt:BlogURL$>prettify.css"></script>
<script type="text/javascript" src="<$mt:BlogURL$>prettify.js"></script>
<script type="text/javascript">
window.onload = function()
{
    var element = document.getElementsByTagName("pre");
    for (i=0; i<element.length; i++)
    {
        element[i].className += " prettyprint";
    }
    if (element.length > 0) prettyPrint();
}
</script>

ブログに <pre> でソースコードを掲載している方は、過去に書いたソースコードもハイライトされますので、試してみてはいかがでしょうか？