CMS構築を目的にPHPをベースとしたWordPress、CakePHPやPEARなどオープンソースを中心に解説しています

WordPressで記事を書く際に画像を追加すると、デフォルトの機能のままでは画像ファイルへのリンクが追加されるだけです。
例えば、「sample.gif」をアップロードした場合に、以下のコードが追加されます。

<a href="http://helog.jp/wp/wp-content/uploads/2011/05/sample.gif">
<img src="http://helog.jp/wp/wp-content/uploads/2011/05/sample-300x243.gif" 
alt="" 
title="wordpress" 
width="300" 
height="243" 
class="alignnone size-medium wp-image-1420" /></a>

画像への直リンクとは味気ないので、thickboxなどを組み込もうかと考えていたのですが、どうやらWordpressにはデフォルトでthickboxが用意されているようです。
利用方法は簡単で、以下のように「header.php」で関数「add_thickbox()」をコールするだけです。

<head>
・・・
<? add_thickbox() ?>
・・・
</head>

これでthickboxに必要なコンテンツが読み込まれるので、画像を追加した際にコードのaタグに「class=”thickbox”」を追加すればthickboxが機能します。

<a href="http://helog.jp/wp/wp-content/uploads/2011/05/sample.gif" 
class="thickbox">
<img src="http://helog.jp/wp/wp-content/uploads/2011/05/sample-300x243.gif" 
alt="" 
title="wordpress" 
width="300" 
height="243" 
class="alignnone size-medium wp-image-1420" /></a>

コードを自動で出力してはくれないんですかね。

ただ、thickboxは公式サイトにもあるように、メンテナンスの停止を示唆しており、他のライブラリを導入することを勧めています。
ThickBox 3.1

今後、Wordpressにlightbox系を組み込む場合は、独自で導入する方向で考えたほうがいいかもしれませんね。

このエントリーをはてなブックマークに追加

Monthly Archives

Search