Fancybox for WordPress のiframeの扱いがアレだったので本家で

WPにはthickboxが標準搭載されているので、headerで

< ?php wp_enqueue_script('jquery'); ?>
< ?php wp_enqueue_script('thickbox'); ?>

とやってやるとclassにthickboxと与えたコンテンツがthickboxで表示できる。
thickboxは軽いしすばらしいjQueryプラグインなのだけど、画像を強制的にリサイズしてしまったり、iframe（別ページの表示）のときのサイズがpx固定だったりして融通が利かないところもあった。第2世代のlightboxとしての役割は十分果たしてくれたが、開発は終了してしまったし使用シーンによってはたまに問題が出ていたのでFancyBoxを試してみた。
（以下WP2.9.2での話）

当初横着をしてFancyBox for WordPressというプラグインを入れた。設定もWP管理画面からできるしWPが生成するthumbnail（の上のA）に自動的にfancyboxクラスを発行した上でfancyboxの適用をしてくれるし至れり尽くせりなのだが、今回の目的である「iframeの高さを％指定で行う」というところで問題が発生した。

設定画面のotherタブにある「フレームの高さ」に「80%」と入れると機能しない。
width:80%,
として発行しているようなので本来の書式
width:’80%’,
となるようにシングルクォートを入れようとしたのだが、入力欄に4文字のmaxlengthがかかっているので
‘80%
までしか入らない。そこでプラグインディレクトリ内のlib/admin-tab-others.phpを直接編集して5文字にした。いちおう80%としては機能しているようだが、別の問題が発覚した。

このA要素はもともとWPの生成したサムネイルではないので通常の指定でfancybox iframeというclassを振ってやるのだが、どうもFancyBox Plugin for WordPress は A要素のheightを基準に80%描画をしようとしている。iframeを閉じたときの振る舞いもおかしい。画像だけに使う分には良さそうだが、プラグインのver2.7.2ではiframe関連はまだこなれていないようだ。

ということでプラグインは諦めた。良いプラグインで作者（fancybox作者とは別）のやる気もあるみたいなのでそのうち治るだろうけど、今回はバグレポートをしている時間が無かったので本家を利用することにした。
テーマディレクトリ内のjs以下にfancyboxの本家を設置して、
head.phpなりhead内のテンプレートを探し、
<?php wp_enqueue_script('jquery'); ?>
<?php wp_head(); ?>
より後に
<script type="text/javascript" src="<?php bloginfo('stylesheet_directory'); ?>/js/fancybox/jquery.fancybox-1.3.0.pack.js"></script>
<link rel="stylesheet" href="< ?php bloginfo('stylesheet_directory'); ?>/js/fancybox/jquery.fancybox-1.3.0.css" type="text/css" media="screen" /></link></code>
と入れ、ドキュメントレディを待って実行されるjQueryスクリプトの中にfancyboxに割り振られたclassなりidなりを定義する。
<script type="text/javascript">//<![CDATA[
jQuery(document).ready(function(){
＜＜A＞＞
});
// ]]>

＜＜A＞＞にはfancyboxのオプションを好きなだけ書けばよい
jQuery("a.割り振ったクラス名").fancybox({
'width' : '75%',
'height' : '75%',
'padding' : 0,
'autoScale' : false,
'transitionIn' : 'none',
'transitionOut' : 'none',
'type' : 'iframe',
'titlePosition' : 'outside',
'autoDimensions' : 'false',
'hideOnContentClick': 'false'

});

ちなみにこのサイトでは本日現在thickboxのまま。