記事内にソースコードを表示させたいとき役立つMODxプラグインの紹介。

記事内でそのまま表示させたいソースコードを、かんたん・きれいに表示してくれるMODxプラグイン”GeSHi Syntax Highlighter”の紹介です。

インストール方法

1.GeSHi Syntax Highlighterのページからファイルをダウンロード。

2.ダウンロードしたファイルを解凍して、「geshi」フォルダをフォルダごとassets/plugins/にアップロード。

3.管理画面からプラグインを新規に作成。プラグイン名と説明は適当に入力。プラグインコードの欄に、assets/plugins/geshi/plugin.GeSHi.tplの内容をそのままコピー。

4.システムイベントのタブに移動、Template Service EventsのOnLoadWebDocumentにチェックをつけて保存。

使い方

コードをそのまま表示したい部分を、<pre>タグで囲むだけ!いちいち「<」を「&lt;」とかに変換しなくていいから、とっても簡単!

言語の指定

表示するコードが何の言語なのかを指定すると、その言語に合わせてコードが色分けされます。<pre language="xml">と指定すればXML、 <pre language="php">と指定すればPHPという具合。何も指定しなければデフォルトの言語が適用されます。デフォルトの言語はプラグインコードの

//Begin configuration
global $defaultGeshiLang;
$defaultGeshiLang="java5";
//End configuration

ここの部分で指定。インストール時にはjava5になっているので、ここをお好みで変更。ちなみに、phpにすることで、MODxのドキュメントタグに使う「[」や「]」にfontタグがつくので、スニペットを呼び出すコードをそのまま記述しても、スニペットが発動しないオマケつき!!上級者は、言語ファイルを自分で新しく作ったり、編集したりも可能だってさ。でも、記事を書く際の面倒を減らす目的でプラグインを導入する場合は、そんな時間もったいないよね!

ちょっとした注意

<pre>のすぐ後に改行を入れると、ウェブ上で表示する際に、余計な空行ができました。しかもTinyとかエディタを使ってると、保存する際に勝手に<pre>の直後に改行が入れられます。・・・だから、リッチエディタって、あんまり好きになれない、さ。