WordPressでソースコードに色をつけるプラグインの使い方：SyntaxHighlighter Evolved

ソースコードの種類に応じて、部分的にテキストの色を変えるSyntaxHighlighterというライブラリがありますが、WordPressにはプラグインがあるので簡単に導入する事ができます。

WordPress以外でSyntaxHighlighterの使い方
ソースコードに色をつけるSyntaxHighlighterの導入方法

使うまでの手順

1. プラグイン新規追加で SyntaxHighlighter Evolved をインストール。
   
2. インストール後「使用する」を押してとりあえず完了。
3. ソースコードに対して、 [html] ソースコード [/html] とマークアップ。
   
   • ※［　］←これは半角で
4. プレビューしてみてください。できましたか？
   
   • ※この段階で表示できてなかったら、WordPressの外観からheader.phpにと、footer.phpにが入っているか確認してみてください。もし、入ってなければ、はの直前、はの直前に記入してください。

通常のSyntaxHighlighterはpreタグに対してnameとidをつけましたが、WordPressのSyntaxHighlighter Evolvedは［　］←この括弧に種類を書いてパラメータを書いていきます。

通常表示

[html]

開始する行数の指定

[html firstline="10"]

自動でリンク設定されるURLテキストの解除

[html autolinks="false"]

右上に出るツールバーの解除

[html toolbar="false"]

行数を非表示にする

[html gutter="false"]

シンプル設定

[html light="true"]

折り畳んで表示

[html collapse="true"]

行を強調させる。カンマで複数設定可能

[html highlight="4,6,8"]

ルーラを表示させる

[html ruler="true"]

Tabの横幅の大きさをかえる

[html tabsize="10"]

行数なくしてシンプルに、自動でつくリンクを解除

[html autolinks="false" light="true" highlight="4,6,8"]

Action Script

[as3]

各言語のbrushと対応JavaScript（SyntaxHighlighter ver.2.0.320）