ソースコードに色をつけるgoogle-code-prettifyを使ってみた

Tsukasa OISHI

  高校の学習指導計画書に「高橋メソッド」と「もんたメソッド」が!という記事。ここまで有名だったのか。すげー。笑ったけど。Rubyの名前まで出てるし。

 Javascriptでソースコードに色をつけるgoogle-code-prettifyを使ってみました。使いかたはとても簡単( こちらを参照)。さっそくkaeruspoonに適用してみました。

1.まずは ここでprettify.cssとprettify.jsを手に入れます。それぞれのファイルを、RailsRoot/public/stylesheets/とRailsRoot/public/javascripts/に置きます。

2.ヘッダでprettify.cssとprettify.jsをインクルードします。

<%= javascript_include_tag "prototype", "effects", "prettify" %>
<%= stylesheet_link_tag 'kaeru', 'prettify' %>

3.bodyタグにonload=prettyPrint()を指定します。

<body onload="prettyPrint()">

4.preタグ、またはcodeタグにclass=prettyprintを指定します。

  def exchange_pre(text)
    "<pre class=\"prettyprint\">\n#{h(text)}\n</pre>\n"
  end

 これだけです。ホントはC言語とかJava用みたいだけどRubyでもいけるね。スタイルシートのほうで色指定できるので、後で調整してみよう。