SyntaxHighlighter Evolved : ソースコードを美しく表示するプラグイン

いつかどこかのサイトで見たきれいなコード表示が忘れられず、「WordPress」「コード」「美しく表示」などのキーワードで検索してみると、ありました！　このブログは先日公開されたばかりの WordPress 2.8 を使っていますが、うまく動くかな？と試しに入れてみると、問題なく動作しました。

SyntaxHighlighter Evolved

ソースコードを美しく表示するプラグイン
配布元：SyntaxHighlighter Evolved 2.1.0

参考サイト：

• SyntaxHighlighter Evolved 導入
• ソースコード整形表示

使い方

1. 配布元より、SyntaxHighlighter Evolved 2.1.0をダウンロードします。（syntaxhighlighter.zip）

2. 解凍すると「syntaxhighlighter」というフォルダが展開されるので、フォルダごと wp-content/plugins にアップロードします。

3. 「プラグイン」の画面で、「SyntaxHighlighter Evolved」を有効化します。（※「使用する」をクリック）

4. これで、 [指定言語] ソースコード [/指定言語] というようにくくると、指定言語に合った表示をしてくれます。

   [php] PHPソースコード [/php]
   [css] CSSソースコード [/css]
   [code lang="js"] Javascriptソースコード [/code]
   

   扱えるソースコードはこの他にもたくさんあり、上記参考サイトでより詳しく説明されています。
   また、ハイライトにしたり、自動改行させない指定などは、以下のように記述できます。

   [code lang="xml"
   firstline="10"          /*開始行番号指定*/
   highlight="3,10"       /*強調ライン指定（複数可）*/
   wraplines="false"       /*自動折返し無し*/
   autolinks="false"       /*URLオートリンク無し*/
   ]ソースコード

   [code lang="xml"
   ruler="true"          /*ルーラー表示*/
   toolbar="false"         /*ツールバー無し*/
   gutter="false"          /*行番号無し*/
   ]ソースコード

注意点

配布元のサイトにも記されていますが、このプラグインにはテーマの header.php に <?php wp_head(); ?>、footer.php に <?php wp_footer(); ?> が必要になります。入っていないと動きません。

この記事に付けられたタグ

SyntaxHighlighter Evolved , ソースコード

関連記事

• <?php wp_head(); ?>を使わないと動かないプラグインがある
• SimplePie Plugin for WordPress : RSSやAtomフィードを読み込み表示するプラグイン
• 新着記事にNewマークを表示させる
• Contact Form 7（日本語） : シンプルかつ柔軟なメールフォームプラグイン
• SimplePie : RSSやAtomフィードをパースするクラスライブラリ