柔軟材: Syntax Highlighter導入

2010/03/12

Syntax Highlighter導入

テンプレート変更ついでに、ずっと棚上げしてた設定を幾つかいじりました。

特に大きいのが、結構つかってるブログ中のソースコードの装飾。

クリボウの Blogger Tips: コードをハイライトする「Blogger Syntax Highlighter」ウィジェット

これを使ったんですが、過去のタグがsyntax highlighterと違うので修正してます。syntax highlighterでは下記のようなタグでソースコードを記述する前提になっています。


 <pre class="java">
  // any code
 </pre>

私は過去のエントリーでは下記の様なタグで記述しています。


 <code title="code title">
  //any code
 </code>

また、文中に埋め込みたいときは下記の様なタグで記述しています。


 <code title="code title" class="inline">//any code</code>

デフォルトでは"pre"または"textarea"タグを検索し、"class"などの属性に"java"や"perl"などの言語名を探しに行くのですが、前者を"code"に変更し、後者は"inline"であれば無視する、指定がない場合は"js"として扱う事にしました。以下のコードは整形しています。

変更前のタグ検索


FindTagsByName(elements, name, "pre");
FindTagsByName(elements, name, "textarea");

変更後のタグ検索


FindTagsByName(elements, name, "code");

変更前のclass属性チェック


if (options == null) 
 continue;
options = options.split(":");
language = options[0].toLowerCase();
if (registered[language] == null) 
 continue;

変更後のclass属性チェック


if (options == null) 
 options="js";  // class属性がない場合、JavaScriptのソース扱い
options = options.split(":");
language = options[0].toLowerCase();
if(language=="inline") // inline指定があった場合無視
 continue;
if (registered[language] == null) 
 continue;

以前に行番号付きで書いてしまったソースは、まぁ全部修正していられないので諦めます。

柔軟材