WordPress 2.9 の新機能の投稿サムネイル画像の使い方

New in WordPress 2.9: Post Thumbnail Images « Mark on WordPress を参考に、WordPress 2.9 の新機能の投稿サムネイル画像の使い方をご紹介。

基本的な使い方

まず編集画面で専用のインターフェースを使えるようにするため、テーマの functions.php ファイル内に次を追加します:

add_theme_support( 'post-thumbnails' );

これで投稿と固定ページの両方の編集画面で投稿サムネイルのインターフェースが有効になりますが、もしどちらか一方だけで有効にしたいのなら次のようにします:

add_theme_support( 'post-thumbnails', array( 'post' ) ); // 投稿で有効
add_theme_support( 'post-thumbnails', array( 'page' ) ); // 固定ページで有効

次に投稿サムネイルの大きさを設定します。一つ目の引数に幅、二つ目の引数に高さをピクセルで指定します。三つ目の引数はサイズ設定のモードで、真偽値で指定し、trueなら切り抜きモードになり、何も指定しなければリサイズ（ボックス）モードになります。

set_post_thumbnail_size( 50, 50, true ); // 幅 50 ピクセル、高さ 50 ピクセル、切り抜きモード
set_post_thumbnail_size( 50, 50 ); // 幅 50 ピクセル、高さ 50 ピクセル、リサイズ（ボックス）モード

切り抜き （cropping-クロッピング） モード

三つ目の引数に true を指定します。このモードでは画像はまず設定した縦横比で切り抜かれ、次に設定した大きさに合うよう縮小されます。

リサイズモード

三つ目の引数に何も指定しません。このモードでは画像の縦横比を変えずに指定した幅と高さの“ボックス”に合うように縮小されます。例えば、大きさとして 50×50 が設定されている場合、100×50 の画像は 50×25　になります。

この設定では縦か横か長いほうが設定されたサイズまで縮小されるので、もとの画像の縦横比が違えばサムネイルの幅や高さも違ってきます。そこで、例えば高さはばらばらでもかまわないが同じ幅でそろえたい場合は、希望のサイズで幅を設定し、高さに9999など絶対に超えないサイズを設定します。

set_post_thumbnail_size( 50, 9999 ); // 幅 50 ピクセル、高さ　9999 ピクセル (制限なし)、リサイズモード

これでサムネイルをテーマに表示するテンプレート関数が利用できるようになりました。以下の関数はループ内で利用する必要があります。

has_post_thumbnail()

この関数はその投稿が手動で選択した投稿サムネイルを持っているかどうかを true/false で返します:

<?php
if ( has_post_thumbnail() ) {
	// サムネイルを持っているときの処理
} else {
	// サムネイルを持っていないときの処理
}
?>

the_post_thumbnail()

投稿サムネイルがあればこの関数でそれを出力します (ループ内で):

<?php the_post_thumbnail(); ?>

ちょっとすすんだ使い方

トップページで 50×50 の切り抜きのサムネイル、個別の投稿（や固定ページ）で幅 400 ピクセル（高さは制限なし）としたい場合、次のようにカスタムサイズを設定します：

functions.php 内に:

add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size( 50, 50, true ); // 通常の投稿サムネイル
add_image_size( 'single-post-thumbnail', 400, 9999 ); // 個別投稿、個別の固定ページでのサムネイル

home.php もしくは index.php (テーマ構成による) 内に:

<?php the_post_thumbnail(); ?>

single.php (のループ内で):

<?php the_post_thumbnail(); ?>

set_post_thumbnail_size() はadd_image_size( ‘post-thumbnail’ ) – デフォルトの投稿サムネイル “ハンドル” – を呼び出します。そして上記のように add_image_size( $handle, $width, $height, {$hard_crop_switch} ) を呼び出すことによって”ハンドル”を追加でき、そのハンドルを the_post_thumbnail( $handle );  に渡すことにより新しいサイズを利用できます。

以前のバージョンの WordPress でのエラーを避けるには

この機能がサポートされていない以前のバージョンの WordPress で上記のテンプレート関数をそのまま使用するとエラーになります。これを避けるには function_exists() を使用してこの関数が定義されている時だけ利用できるようにします。

if ( function_exists( 'add_theme_support' ) ) { // 2.9 で追加
	add_theme_support( 'post-thumbnails' );
	set_post_thumbnail_size( 50, 50, true ); // 通常の投稿サムネイル
	add_image_size( 'single-post-thumbnail', 400, 9999 ); // 個別投稿のサムネイル
}

注意事項

この機能が完全に動作するのは新しい画像のアップロード時だけです。すでにアップロード済みの画像のリサイズはできません。テーマに新しいサイズが定義される前にアップロードされた投稿サムネイルを持つ投稿でこのテンプレート関数を呼び出すと、切り抜きはできなくてブラウザでボックスリサイズされます。今のところは、Viper007Bond のすばらしいプラグイン Regenerate Thumbnails で足りない画像サイズのサムネイルを再生成することができます。

他の参考ページ

• Codex 英語版: Post Thumbnails
• Codex 日本語版: 投稿サムネイルタグ

関連投稿

• amty thumb recent (0)
• BinaryThumb (0)
• Thumblated Related Post (0)
• My Youtube Playlist (0)
• ChoiceCuts Image Juggler (0)