WordPress - シンタックスハイライト関連プラグイン | Technolog.jp - ICTウェブマガジン

WordPress – シンタックスハイライト関連プラグイン

  • 2012/02/08
  • カテゴリー:CMS

Better WordPress Syntax Highlighter

テック系のウェブサイトでは、コーディングを表記するために頻繁に上図のようなシンタックスハイライトを使用します。WordPressにはそのためのプラグインが豊富に揃っており、中でも筆者がオススメするプラグインを5つご紹介させていただきます。

Crayon Syntax Highlighter

Crayon Syntax Highlighter

現在、本サイトでも愛用させていただいている「Crayon Syntax Highlighter」は、コードのコピー、ポップアップウィンドウ表示、プレーンテキスト表示を可能にするシンタックスハイライターです。約15言語に対応し、複合言語(HTMLとPHP等)表示も可能です。デザインも良く、何より更新頻度の高さに関心しています。

WP SyntaxHighlighter

WP SyntaxHighlighter

PREタグに「class=”brush: lang”」を指定して使用します。langには、コード種別(html, php, java等)を入力して下さい。サポートされているコードは35種類。本文だけではなく、コメントでも使用できることが特徴で、ビジュアルエディタでもPREまたはCODEボタンを使用することでポップアップウィンドウが表示され、入力することができます。

CodeColorer

CodeColorer

CodeColorerの特徴は、100種類を超える対応言語の豊富さにあります。デフォルトのデザインはCrayon Syntax Highlighterに劣るかもしれませんが、CSSをカスタマイズしてお好みのデザインにすることも可能です。

WP-Syntax

WP-Syntax

PREタグにlang属性を付与し、言語を指定するだけの汎用性が高いシンタックスハイライターです。万一、プラグインが機能しなくなったり、削除した場合でもPREタグとして認識されます。デザイン性は前者に劣りますが、100種類を超える対応言語の豊富さは魅力です。

Better WordPress Syntax Highlighter

Better WordPress Syntax Highlighter

こちらもPREタグやCODEタグでlang属性を指定することでシンタックスハイライトを表示するプラグインです。17言語に対応し、トグル表示の他、開始行の指定、extra属性に行番号を指定することでグレーアウト表示、カスタマイズすることで言語の追加やそれに応じたCSSの設定も可能です。