高機能なSyntaxハイライター-WordPressプラグイン

当ブログでは「Crayon Syntax Highlighter」というWordpressプラグインを利用しています。
主にコマンドリファレンス等のソースコード部分にハイライトを適用しています。

以下に記述例を示します。↓こんな感じです。

<pre class=”lang:batch decode:true”>MORE [/E [/C] [/P] [/S] [/Tn] [+n]] < [ドライブ:][パス]ファイル名

コマンド名 | MORE [/E [/C] [/P] [/S] [/Tn] [+n]]
MORE /E [/C] [/P] [/S] [/Tn] [+n] [ファイル]

[ドライブ:][パス]ファイル名
一度に 1 画面ずつ表示するファイルを指定します。

</pre>

上記ソースを実際に動かすと下記のデザインになります。カラーリング設定などは初期値があり自由に変更できます。

MORE [/E [/C] [/P] [/S] [/Tn] [+n]] < [ドライブ:][パス]ファイル名

コマンド名 | MORE [/E [/C] [/P] [/S] [/Tn] [+n]]
MORE /E [/C] [/P] [/S] [/Tn] [+n] [ファイル]

[ドライブ:][パス]ファイル名
一度に 1 画面ずつ表示するファイルを指定します。

Crayon Syntax Highlighterについて

Syntaxハイライターには独自のタグを利用するものと、PREタグとCSSクラスを利用するものがあります。
「Crayon Syntax Highlighter」は実に高機能で、既存のPREタグにハイライト機能を適用してくれます。
上記のソースコードと実際にプラグインを適用した後の表示イメージを載せていますがスタイルシートもとてもシンプルに記載することが出来ます。
GUIでSyntaxハイライトを高度に設定することもできますが、プラグイン異存は極力避けたいので、シンプルな利用方法で留めています。
その他、デフォルトで提供されているハイライター数が多いのも魅力です。
MS-DOSとか出てきます。

Crayon Syntax Highlighter 設定方法

CrayonでPREタグを利用する場合はCrayonプラグインの設定画面⇒タグ⇒「Crayonsとして<pre>タグをキャプチャ」にチェックを入れてください。デフォルトでは行番号などの表示もできたりしますが、残念ながら非表示にしたい場合も必ず表示されから消えるため若干違和感があります。

WordPressテーマとの相性もあり、相性が良くない場合はソースの自動折り返しなどで行番号と実際の出力行がずれてしまうケースがありましたのでご注意ください。

使いこなしたらいろいろと楽しめそうなプラグインですが、単純に導入することが出来ますので超おすすめです！