Evolvedは、ブログの記事内に記述したソースコードを行番号付きで綺麗に表示することができるプラグインです。何かしらのコードを紹介するようなブログでは必須のプラグインといえるでしょう。Evolvedを導入すると、以下のような感じでコードを表示させることができます。World!</body></html>色分けもしてくれるので、普通に書くよりもかなり見やすくなりますね。Evolvedのインストールインストール手順は以下の通りです。Evolvedをダウンロードします。wp-content/pluginsにアップロードします。Evolvedプラグインを有効化します。[SyntaxHighlighter]で細かい設定を行います。SyntaxHighlighterの設定SyntaxHighlighterのバージョン:バージョン2と3から選択することができます。バージョン2ではコードをコピーしたりするためのツールバーが表示されコードは折り返し表示されます。バージョン3は折り返しがなくツールバーも表示されませんが、コード部分のみ(行番号を含まない)を選択してコピーすることができます。テーマ:色などの見た目を決めます。すべてのブラシを読み込む:チェックを入れると常にすべての言語ファイルを読込みます。一般:行番号の表示有無やツールバーの表示有無などを設定します。Evolvedで表示する領域にCSSのクラスを追加することができます。行番号の開始:行の開始番号を設定します。行番号の余白:行番号の余白を設定します。タブのサイズ:タブ部分のサイズを指定します。タイトル:タイトルを入れたい場合は入力しておきます。設定が完了したら、[変更を保存]で設定を保存します。設定を保存すると、下の方にあるプレビューが更新されるので、プレビューを見ながら設定を変更していきましょう。Evolvedでコードを表示させたい部分を以下のようにショートコードで囲みます。/code]※ショートコードの先頭に半角スペースを入れています。実際にショートコードを記述する時は半角スペースは不要です。/php]のように言語名をショートコードで指定することもできます。Evolvedが対応している言語では、それぞれに合った色分けをしてくれます。Evolvedが対応している言語は、以下の通りです。5PythonRubySQLSmalltalkYAMLショートコードパラメータショートコードにパラメータを追加することで、さらに細かく表示形式を指定することもできます。autolinks:自動リンクの有効・無効classname:コードボックスに追加するCSSのclasscollapse:コードボックスをデフォルトの状態で閉じるかどうか。コードボックスを開くにはクリックが要求されます。firstline:行番号の出力の際に、最初の行の番号を表す数値gutter:左側に行番号を配置するかどうかhighlight:ハイライトさせる行番号のリスト(カンマ区切り)、範囲でも指定可能。ハイライトするかどうか。使うようにHTML/XMLとプログラムが混在するような時に有効です。light:行番号やツールバーを無効にする軽い表示モードのオン・オフpadlinenumbers:行番号の余白。(v3のみ):コードの前に表示される表題テキスト。(v2のみ):折り返しの有効・無効パラメータを指定する際は、以下のように記述します。行番号の余白:なしをパラメータで指定しています。あとがきツールバーを使うかどうかは、好みが分かれるところだと思います。当ブログでは、以前はバージョン2を使ってツールバーを表示させていましたが、今はバージョン3を使っています。Evolvedを導入しているブログはかなりたくさんありますが、バージョン2の方が人気はありそうなイメージです。どちらがダメとか使いにくいということではないので、好みで設定しましょう。コメントをキャンセルメールアドレスが公開されることはありません。