はじめに 「WP SyntaxHighlighter」は、ソースコードをハイライト表示させるためのプラグインです。 Bash、C++、CSS、Delphi、Java、JavaScript、Perl、PHP、Python、Ruby、SQL、VB、XML、XHTML、HTMLを始めとする多数の開発言語、スクリプト、マークアップ言語をサポートしています。 このプラグインは、JavaスクリプトライブラリのSyntaxHighlighter バージョン3.0.83 および、2.1.382を使用しています。 SyntaxHighlighter: http://alexgorbatchev.com/SyntaxHighlighter/ 特徴 ・Javaスクリプトライブラリ「SyntaxHighlighter」を採用。 ・バージョン3.0.83および2.1.382の2つのライブラリを切り替えて利用可。 ・操作が簡単なTinyMCEボタンとQuicktagボタン。 ・エディターからボタンを使って
タグを入力出来き、オプションの変更も可能。
・ショートコードもサポート。
・コメント欄のソースコードもボタンを使って簡単にハイライト表示可。(WordPress 3.0以上)
・ソースコードの強調表示が可能なウィジェット。
・「bbPress」プラグイン バージョン2.0以上をサポート。
・「Dynamic Brush Loading」をサポート。必要な言語設定ファイルのみが動的に読み込まれます。
・ハイライト対象のコードを含む投稿、固定ページ、ホーム、カテゴリー、アーカイブ、検索結果、コメントでのみ、Javaスクリプトが読み込まれます。
・「SyntaxHighlighter」の殆どのオプションを網羅する設定画面。
・管理画面やメッセージは、英語と日本語(UTF-8)に対応。

= サポートする言語 =

AppleScript、ActionScript3、Bash、ColdFusion、C、C++、C#、CSS、Delphi、Diff、Erlang、Groovy、HTML、Java、Java FX、JavaScript、Pascal、Patch、Perl、PHP、Plain text、PowerShell、Python、Ruby、Ruby on Rails、Sass、SCSS、Shell、SQL、VB、VB NET、XHTML、XML、XSLT

バンドルされているサンプルプラグインを使えば、次の言語を追加することも出来ます

Biferno、Clojure、DOSバッチファイル、F#、LISP、Lua(SyntaxHighlighter 3.0のみ)、MEL Script、Objective-C、PowerCLI、Processing、R、S、S-PLUS、Tcl、Verilog、Vim Script、YAML

詳しくは、「sample」ディレクトリを参照のこと。

※一部の言語は「SyntaxHighlighter 3.0」のみに対応。

= オススメのプラグイン =

SyntaxHighlighter TinyMCE Button」は、ビジュアエディター(TinyMCE)に「SyntaxHighlighter」のための高機能な2つのボタンを追加します。

SyntaxHighlighter TinyMCE Button: http://wordpress.org/extend/plugins/syntaxhighlighter-tinymce-button/

「CodeMirror for CodeEditor」は、テーマエディター、プラグインエディターのソースコードを強調表示し、便利なツールバーを追加します。

CodeMirror for CodeEditor: http://wordpress.org/extend/plugins/codemirror-for-codeeditor/


1.動作環境

・WordPress バージョン2.8 以上、3.0以上推奨


2.インストール

・ダウンロードしたファイルを解凍し、「wp-syntaxhighlighter」フォルダごと、WordPressのプラグインディレクトリ(wp-content/plugins/)にアップロードします。
・WordPressの管理画面の「プラグイン」で、このプラグインを有効化します。
・WordPressの管理画面の「設定」の中の「WP SyntaxHighlighter」という項目で設定を行います。


3.アップデート

WordPressの管理画面で、「WP SyntaxHighlighter」を停止し、インストールの要領でファイルをサーバーにアップロード、上書きした後、再度、有効化する。


4.アンインストール

WordPressの管理画面で、まずプラグインを停止し、削除を実行する。


5.使い方

5-1.ビジュアルエディターを使って記事を書く場合

注意:「SH TinyMCE Button」は、標準のビジュアルエディター「TinyMCE」にのみ対応しています。他のビジュアルエディター(例:CKEditor)は、サポートしていません。

注意:「unfiltered_html」権限を持たないユーザーは、をコード内で使用することは出来ません。
XXXX=0-9、A-F、a-fで構成される2から4文字の文字列。

※「SH TinyMCE Button」を使って、投稿やページ上に既にあるソースコードをハイライト表示させたい場合。

・ハイライト表示させるソースコードを選択し、反転表示させる。
・「pre」ボタンをクリックする。
・言語とオプションを選択する。
・「挿入」ボタンをクリックする。


※「SH TinyMCE Button」を使って、ソースコードを投稿やページにペーストしたい場合。

・「CODE」ボタンをクリックする。
・言語とオプションを選択し、ソースコードをテキストボックスにペーストする。
・「挿入」ボタンをクリックする。


※「SH TinyMCE Button」を使って、ハイライト表示済みのソースコードの言語やオプションを変更したい場合。

・設定を変更したいソースコードを選択し、反転表示させる。
・「pre」ボタンをクリックする。
・言語とオプションを変更する。
・「更新」ボタンをクリックする。


※ソースコードをタブでインデントさせる場合。

・単にTABを入力します。ただし、
タグでマークアップ済みのソースコードでなければ、TABによるインデントは有効になりません。


5-2.HTMLエディターを使って記事を書く場合

注意:「unfiltered_html」権限を持たないユーザーは、をコード内で使用することは出来ません。
XXXX=0-9、A-F、a-fで構成される2から4文字の文字列。

※「SH pre」ボタンを使って、投稿やページ上に既にあるソースコードをハイライト表示させたい場合。

注意:「SH pre」ボタンを使うには、設定画面で「HTMLエディターの設定」の「Quicktagボタンを追加」を有効にする必要があります。

・ハイライトボタン表示させるソースコードを選択し、反転表示させる。
・「SH pre」ボタンをクリックする。
・言語とオプションを選択する。
・「OK」ボタンをクリックする。


※ボタンを使わずに
タグでマークアップする場合

下記の文法に従い、HTMLエディターやビジュアルエディターの「整形済み」スタイルを使用して
タグでソースコードをマークアップします。

エスケープする文字:<、>、&、"、'

文法:ハイライト表示したいコード を
タグでマークアップします。

書式: 
コード
*lang = your language 例1:
PHP コード
例2:
XHTML コード
使用可能な言語: http://alexgorbatchev.com/SyntaxHighlighter/manual/brushes/ *表中の「Brush aliases」が言語名になります。 保存時にソースコードは、自動的にエスケープされますので、予めソースコードをエスケープする必要はありませんが、ビジュアルエディターに切り替えると、ソースコードは破壊されてしまいます。 これを防止するために、予めソースコードをエスケープするか、ビジュアルエディターに切り替える前に、一旦、保存して下さい。 注意:ソースコードに
が含まれる場合は、予め、
で置き換えて下さい。 言語以外にもオプションの指定が可能です。 例3:
XHTML コード
例4:
PHP コード
使用可能なオプション: http://alexgorbatchev.com/SyntaxHighlighter/manual/configuration/