コミル

福祉支援サービス　コミル

コミルは障害をお持ちの方の生活をモノの工夫によって豊かにすることをお手伝いします。

福祉支援サービス　コミル

コミルは障害をお持ちの方の生活をモノの工夫によって豊かにすることをお手伝いします。

作成日:2010/10/23
タグ:(none)

シンタックスハイライト

google-code-prettify を tDiary で使う

tDiary でシンタックスハイライト (Syntax Highlight) をしようと、なにがいいかいろいろ調べていました。

tDiary では GeSHi の実績があるようだったのですが、tDiary Ver.3系では HikiDoc のバージョンの違いから結構書き換えないといけなさそうだったので結局却下。

悩んだ末に google-code-prettify にしました。

以下、手順。

1. google-code-prettify本家からソースコードをダウンロードして展開、src 以下を tDiary インストールディレクトリ下にコピー。

2. 下記コードを tDiary インストールディレクトリ下に misk/plugin/prettify.rb として保存。

#
# prettify.rb
#
add_header_proc do
  <<-ADDTEXT
    <link href="src/prettify.css" type="text/css" rel="stylesheet" />
    <script type="text/javascript" src="src/prettify.js"></script>
  ADDTEXT
end

3. tDiary インストールディレクトリ下の skel/header.rhtml を下記diffの通りに変更

6c6
< <body<%%= /form|edit|preview/ =~ @mode ? ' class="update"' : ''%>>
---
> <body<%%= /form|edit|preview/ =~ @mode ? ' class="update"' : ''%> onload="prettyPrint()">

4.設定/プラグイン で prettify.rb を有効にすれば完了。

<<< ruby
(ソース本文)
>>>

と書けばハイライト表示します。なお、<<<の後のキーワードは何でもかまいません。(google-code-prettify はソースの形式を指定する必要がなく、勝手に判断するらしい。)おかげで、Aruduino の pde ファイルも貼れますね。(Arduino固有の予約語はハイライト表示してくれないけど。)

skel/header.rhtml という tDiary 本体部に手を加えてしまうのはちょいと野暮ですが(プラグインで body tag をいじる方法がわからなかった)、まぁ一応は良しとしましょう。

なお、上記2つのソースも本方法を用いて表示しています。

(CodeRayに変更しました。)

blog comments powered by Disqus