ウチのブログはTOPに2カテゴリー並列に出るようにしてるがそのせいなのか「jQuery ColorBox」プラグインが正常に動かなくなってしまった。 しょうが無いので本家を導入したのでメモ。

1.WordPressで自動読み込みされるjQueryは「jQuery.noConflict();」が記述されていてそのままでは動かないので以下コードで変換する。

<script type="text/javascript">
    jQuery(function($){
        // jQueryコード記述：$＝jQueryに置換される
    });
</script>

2.Colorboxはデフォルトだと’example1～5’を’rel’要素に記述することでエフェクトを変更出来る。だが記事を書いたり何か変更を加えるたびにrelを記述するのでは手間がかかるのでリンク先が’.jpg’、’.gif’、’.png’の場合に自動的に’rel=example1’を挿入するコードを書き加える。

<script type="text/javascript">
    jQuery(function($){
        $('a[href$=".jpg"], a[href$=".gif"], a[href$=".png"]').attr({rel:"example1"});// rel要素に'example1'追加
		//以下Colorbox用のjQueryコード
    });
</script>

これでリンク先が画像の場合自動的に’rel=example1’が挿入されグループ化される。
超忘れそうだからメモ。