AutoPagerizeとsyntaxhighlighterプラグインをWordPressで使う

2009-07-10 (金)カテゴリJavascript , Word Press , プラグインタグ ,

Autopagerとsyntax-highlighter

最近このブログの機能アップに費やす時間を増やしています。
色々と便利にしたいなとWP-AutoPagerizeプラグインを入れてみました。

これは元々FirefoxのGreaseMonkeyというアドオンの追加するユーザスクリプトで、検索結果やニュースページを見る際にページ遷移をせずにある一定のスクロールをした段階で、次のページの記事が追加されるという優れもの。

ただ、その上で問題になったのがsyntaxhighlighterプラグイン
これはソースコードを見せる際に綺麗に整形してくれるプラグインです。

何が問題かというと、次ページ記事を読み込んで表示する際にソースコードがあった場合に、syntaxhighlighterの表示処理の動作をしてくれないというものでした。
そのため両方のプラグインの調整が必要になりました。

その調整のやり方を記載しておきます。


まずは、Autopagerが新しいページを読み込んだ際にsyntaxhighlighterの関数を呼び出すよう設定します。wp-autopagerize.jsはソースコードが圧縮されているので、15行目をコピペして貼り付けてOnline Beautifier for JavaScriptなどで綺麗に整形しなおしてもらいましょう。
50行目にソースコードを追加します。

wp-autopagerize.js

Java Script
var o = function () {
  l.show();
  $.ajax({
    url: k,
    success: function (h) {
      if ($(pageRizeClassName, h).length > 0) {
        j++;
        c.before("<p id='page-" + j + "' class=\"pageNum txt75\"><a href='" + k + "'>" + j + "</a> ページ目</p>");
        k = $("p.pageNav a.next", h).length > 0 ? $("p.pageNav a.next", h).attr("href") : null;
        c.before($(pageRizeClassName, h).filter(function () {
          return ! $(this).hasClass("pageNav");
        }));
        m = b.scrollHeight;
        g();
        SyntaxHighlighter.highlight();//この行を追加
      }
      l.hide();
    },
    error: function () {
      l.hide();
    }
  });
};

これでJavascript側の修正は終了。続いてsyntaxhighlighterを修正します。

syntax_highlighter.php

PHP
function add_footer(){
	$enabled = false;
	foreach ($this->options as $key => $val) {if ($val[0]) {$enabled = true; break;}}
	if (!$enabled) return;

	$scripts  = "<script type=\"text/javascript\" src=\"{$this->plugin_url}js/shCore.js?ver={$this->plugin_ver}\"></script>\n";
	$scripts .= "<script type=\"text/javascript\" src=\"{$this->plugin_url}js/shBrushAll.js?ver={$this->plugin_ver}\"></script>\n";

/*
	// Bash / shell
	if (isset($this->options["bash"]) && $this->options["bash"][0])
		$scripts .= "<script type=\"text/javascript\" src=\"{$this->plugin_url}js/shBrushBash.js?ver={$this->plugin_ver}	

	(中略)

	elseif (isset($this->options["xslt"]) && $this->options["xslt"][0])
		$scripts .= "<script type=\"text/javascript\" src=\"{$this->plugin_url}js/shBrushXml.js?ver={$this->plugin_ver}\"></script>\n";
*/
	echo $scripts;

上記の修正は、syntaxhighlighterでは各プログラムソース毎にJavascriptファイルを持っていて、読み込んだ記事内で使っているプログラム表示用のJavascriptのうちどれを読み込むかを判定しています。
今回は判定を飛ばして、各プログラム用JSを一つのファイル「shBrushAll.js」にまとめてそれを読み込ませることで対応しています。

 

使用プラグイン
WP-AutoPagerizeプラグイン
syntaxhighlighterプラグイン

コメントをする

http://mizoochi.com/archives/621.html/trackback