hiromasa.zone : o)

PHPコードを行番号付きで色分け表示するプラグイン＠Chameleon Cyberさん にトラックバックしています。

「WordPress のプラグインを作ろう」というドキュメントを書こうとしていたのですが、、困ったことが一点。

ソースをきれいにサイトに表示するにはどうすればいいか。

やっぱり色分けしたほうがいいよなーとか、行番号もあった方がいいとか、別画面起動はいやだなーなどと思っていたら、素晴らしいプラグインが登場!!

PHP Highligh String Ver.0.1.1
しばらく、Syntax Highlighter Enscriptプラグインを愛用していたのですが、これは行番号をつけてくれません。
そこで、Syntax Highlighter Enscriptと（たぶん）互換で、さらに行番号を出力してくれるプラグインを作ってみました。ただし、PHPコード専用です。

完璧です。　行番号付でかつ、コピーアンドペーストで行番号がくっついてきません。　

文書中でコードの部分解説もしたかったので、行番号の開始行数を指定できるようにアドホックコードを追加してみました。

82 行目からの analyze_callback 関数に number 属性を取得できる処理を追加。

function analyze_callback($match) {
    $attr = $match[1];
    $code = $match[2];
    $code = str_replace('\"',  '"', $code);
    
    $re_num = '/\s+number\s*=\s*["\']?([^"\']+)["\']?/xi';
    if(preg_match($re_num, $attr, $number)) {
    	$start_number = $number[1];
    } else {
    	$start_number = 1;
    }
    
    $re_lang = '/\s+lang\s*=\s*["\']?([^"\']+)["\']?/xi';
    $num = preg_match($re_lang, $attr, $lang);
    if ($num) {
        $code = htmlunspecialchars($code);
        $code = set_color($code, $lang[1], $start_number);
        $attr = preg_replace($re_lang, '', $attr);
    }
    return "<pre$attr>$code</pre>";
}

31行目、set_color 関数を number をもらうようにして、

function set_color($code,$lang, $start_number) {

54 行目くらいで 最初の <? php ? と ?> を削除して、

    array_shift($temp_array);
    array_pop($temp_array);

56行目の ol タグに start 属性 で 開始行を指定しています。

    $code = "<div class=\"code\"><ol start=\"$start_number\">". @join('', $temp_array) . "\n</ol></div>";

開始行については IE は 100以上指定できないようです。でも分かるから OK ということにしましょう。 🙂

上のソース表示は、早速 PHP Highligh String を使わせて頂いているものです。　いやあ、素晴らしい。

chameleon さんどうもありがとうございました。　感謝です。

追記。

（あ、\ マークが消えてしまっている.. あれ、どうすればいいんだ。。　明日ちょっとみてみます）

↑わかりました、正規表現文字がソース中にあると削除されてしまうようなので、事前にクオートすると良いようです!。

    $code = highlight_string( $code, true ); 
    $code = preg_quote($code, '/');

これで OK そうです。 🙂

PHP Highlight String Ver.0.1.2 で修正していただきました!。　しかも上の直し方は間違いです。。orz　どうもありがとうございました!。

このブログで関連すると思われる他の投稿

• WordPress のエントリでプログラムコードをハイライトする!
• WordPress プラグイン作成時のノウハウ – 後編 –
• WordPress のエントリでプログラムコードをハイライトする! – その２ –
• 管理画面のある WordPress プラグインの作成方法
• wp-hatena にみるプラグインの作成方 – 前編 –