2008/07/26

コードをハイライトするウィジェット

クリボウの Blogger Tipsにコードをハイライトするウィジェットが紹介されていました。Bloggerにこんな機能を追加できるんですね。自分もウィキトラベルではJavaScriptやBookmarklet、オープンストリートマップではPerlのスクリプトを作ったりしているので面白そう。クリボウさんの記事を全部読んだ訳ではないので他にも同種のウィジェットが紹介されているかも知れませんが、とりあえず次の2つを書いておこうと思います。


ひとつはCode Prettifyウィジェットgoogle-code-prettifyを使ったもので、表示はIDEやソースコードに対応したテキストエディタのソースコード部分だけという感じです。

もうひとつはBlogger Syntax Highlighterウィジェット。元はsyntaxhighlighterで、行番号やメニュー(コードだけをポップアップウィンドウで表示、印刷、IEの場合のみクリップボードへのコピー)が表示されるほか、折りたたみ機能や桁番号表示のオプションもあるようです。私にとって残念なことはPerlには対応していないんですよね。

それぞれの表示例、導入方法、使用方法については以下のリンク先を参照して下さい。実際の投稿に必要なタグ・オプションの追加や記号の変換をしてくれるツールもリンク先で提供されています。



どちらを利用するか少し迷いましたが、コードをコピーする時に行番号が選択されず、折りたたみ機能も付いていて便利そうなので、Blogger Syntax Highlighterウィジェットを追加してみました。ちょっと弄ってPerlにも対応させられるといいなぁ。

2008年7月28日 追記

Blogger Syntax Highliter with Perl support を作ってみました。
Atom