power source*

コードを見やすく表示するプラグインはいくつかあるが、WP のバージョンに合わないものもあって、どれがいいのかなあと思っていた。
[Numb.](http://www.graphact.com/memo/2006/03/16/33 title=”Numb. » コード表示を iG-Syntax Hiliter で見やすく) さんや [cameraLady](http://june29.jp/2006/07/16/plugin-stream/ title=”cameraLady » プラグイン続々) さん で紹介されていたこのプラグインを使ってみた。

iG:Syntax Hiliter

機能概要	記事に貼り付けたソースコードを、言語に応じて色分け表示する。実体参照への自動変換もしてくれる。
バージョン	3.5
作者（web)	Amit Gupta さま
配布元	Canned !! — my Atropine » iG:Syntax Hiliter
ドキュメント	同梱の MANUAL.html
動作見本	下記関連リンク等
「ページ」対応	未確認
注	下記留意事項あり
適用したWP	WordPress ME 2.0.4 [UTF-8]

表示で気になるところがあるのと、うちは表示が重くなっていると思うので、先にキャッシュ機能を検討することにして、現在は無効化してある。
試したのが短時間だったので、この記事もかなり適当。

導入手順

MANUAL.html#installation 参照

1. 配布元より最新版をダウンロード。
2. 解凍すると、iG-Syntax Hiliter/ フォルダの中に次のファイルができる。
   • READ ME.txt
   • MANUAL.html — マニュアル
   • GNU GPL.txt
   • ig_syntax hiliter plugin/ フォルダ
3. ig_syntax hiliter plugin/ フォルダ内の次の 2つを wp-content/plugins/ ディレクトリへアップロード。¹
   • syntax_hilite.php — プラグイン本体
   • ig_syntax_hilite/ フォルダ — GeSHi エンジン、CSS、JavaScript、画像
4. 管理パネルにて有効化。

設定

管理パネル > オプション > iG:Syntax Hiliter 画面

MANUAL.html#configuration 参照。

• [RESET DEFAULT SETTINGS] ボタン: 設定値を初期化
• Show Plain Text Code Option: 行番号や色分けのために、記事表示時のコード内には HTML タグや CSS が含まれるが、このオプションを YES にすると、Plain Text Code（純粋にコードのみをテキスト表示する）へのリンクを添えられる。（訪問者がコピペ等出来るようになる）
• Show Plain Text Code In: 前項の Plain Text Code を、別ウィンドウ表示するか、色分けコードボックス内に再表示するか。
• Show Language Name: 言語名を表示するか。
• Hilite Code in Comments: コメント中のコードも色分け表示するか。
• Show Line Numbers: 行番号を表示するか。
• Show Fancy Line Numbers: 行番号を1行置きに強調・色分け表示するか。
• Line Colour 1: 前項指定時の 1行目の色。
• Line Colour 2: 同 2行目の色。前項と互い違いに色分け。

クイックタグの設定

• MANUAL.html#quicktags 参照。
• プラグイン WP-AddQuicktag を使ってクイックタグに登録。quicktags.js は書き換えなくて OK。
• 自分が使いそうな言語用のタグを num= 付きで登録しておいた。PHP（[php num=1][/php], HTML（[html num=1][/html]）, CSS（[css num=1][/css]）。

使い方

• 登録したクイックタグのうち 言語に合うものをクリックして、コードを括る。
• 開始行を指定するときは num=開始行番号 にする。指定しないときは num=1 を削除。

使用例

今はプラグインを無効化しているので、この項削除。

留意事項

MANUAL.html#important 参照。

• タグを閉じ忘れない。
• 入れ子にしない（出力が壊れるので試さないこと）。
• Textile 1 & 2 や Markdown のようなテキスト整形プラグインと一緒に使うと問題が起こるかも。
  → PHP Markdown Extra を有効化したまま、この記事で試しに使った限りは大丈夫だった。何らかの条件下ではおかしくなるのかな。
• WYSIWYG エディタ、excerpt については、マニュアル参照。
• ロードなしで表示を早くするには、Ricardo Galli の WP-Cache プラグインを試してみて、とある。

遭遇した問題と対応

問題点

• コードを囲む枠線等が描画されない。
• PLAIN TEXT をクリックしても何も起こらない。

原因・対応

• 記事の head タグ内を見たら、リソースの URI に wordpress/ が不足していた。

  <link rel="stylesheet" href="http://bono.s201.xrea.com/wp-content/plugins/ig_syntax_hilite/css/syntax_hilite_css.css" type="text/css" media="all" />
      <script language="javascript" type="text/javascript" src="http://bono.s201.xrea.com/wp-content/plugins/ig_syntax_hilite/js/syntax_hilite_js.js"></script>
  

• syntax_hilite.php の 29行目から。

  $ig_geshipath = ABSPATH."wp-content/plugins/ig_syntax_hilite/"; // physical path to the directory where geshi directory resides, should end with a /
  $igsyntax_hiliter_path = get_settings('home')."/wp-content/plugins/ig_syntax_hilite";  //URL to the plugin directory
  require_once("{$ig_geshipath}geshi.php"); // include the GeSHi Core

• 30行目の get_settings('home') を get_settings('siteurl') に修正。

  // $igsyntax_hiliter_path = get_settings('home')."/wp-content/plugins/ig_syntax_hilite";    //URL to the plugin directory
  $igsyntax_hiliter_path = get_settings('siteurl')."/wp-content/plugins/ig_syntax_hilite";   //URL to the plugin directory

説明・資料

• $ig_geshipath — geshi ディレクトリが存在するディレクトリの物理的パス（絶対パス？）、末尾にスラッシュ付き。
• $igsyntax_hiliter_path — プラグインディレクトリのURL
• get_settings('home') — 一般設定パネルの「ホームページアドレス (URI)： http://bono.s201.xrea.com」
• get_settings('siteurl') — 一般設定パネルの「WordPress のアドレス (URI)： http://bono.s201.xrea.com/wordpress」
  設置ディレクトリを取得したいなら、こちらを使うべきではないかなーと思うので、上述のように修正した。
  • 「ホームページアドレス (URI)：」と「WordPress のアドレス (URI)：」は同じ値の人が多いかもしれない。うちの値が違うのは WP: 設置ディレクトリと異なるページをホームにする の設定のため。
  • Wordpress Codex » Function Reference
  • Wordpress Codex » Function Reference » get_settings
  • get_settings('siteurl') とテンプレートタグ get_bloginfo('wpurl') は同じ値。両者の使い分けはよく分からない。get_bloginfo はテンプレート用なのかも。
• ABSPATH — 同じ wordpress/ ディレクトリを指すが、こちらは URI ではなくディレクトリパス。Codex の文書はまだ見つけてない。この値は wp-config.php 内にて define('ABSPATH', dirname(__FILE__).'/'); と定義されている。
  • dirname — PHPマニュアル: dirname
  • __FILE__ — PHPマニュアル: 自動的に定義される定数

関連リンク

• Numb. » コード表示を iG-Syntax Hiliter で見やすく
• ccameraLady » プラグイン続々
• iG:Syntax Hiliter 日本語版 — ver.3.5 の日本語版を配布されています。
• :: plasticdreams :: » 最近入れたプラグイン — 連続ハイフンの変換は WP がしてくれていたことを知る。（ブラウザか表示フォントのせいでくっついて見えるのかと思ってましたー。(^-^;） 勉強になりました。

functions-formatting.php 11行目あたりから。

if (isset($curl{0}) && '<' != $curl{0} && $next) { // If it's not a tag
    $curl = str_replace('---', '&#8212;', $curl);
    $curl = str_replace(' -- ', ' &#8212; ', $curl);
    $curl = str_replace('--', '&#8211;', $curl);
    $curl = str_replace('xn&#8211;', 'xn--', $curl);
    $curl = str_replace('...', '&#8230;', 

1. ig_syntax hiliter plugin/ フォルダごとはダメ。[back]

関連ページ

• 記事でのコードの書き方
• WP plugin: 実体参照へ変換 - DeCoder
• WP: 設置ディレクトリと異なるページをホームにする
• WP plugin: 簡易記法で記事を書く - PHP Markdown Extra
• WP plugin: 投稿画面のクイックタグを追加 - WP-AddQuicktag