WordPressのアイキャッチ画像を複数サイズ表示させる

WordPressのアイキャッチ画像を複数サイズ表示させる

WordPressで表示されるアイキャッチ画像のサイズを、表示する場所によって変えたいケースが出てくることもあります。たとえば、トップとカテゴリー等のアーカイブ表示とかとか。

そんな場合でも、大して記述することもなく簡単に実装することが出来てしまいます。

実を言えば、アイキャッチ画像(投稿サムネイル)も単なるメディアのアップロードされた画像でしかありません。
つまり、メディアにて異なる画像サイズが生成されるようにしておき、表示するときには、追加設定したサイズの画像を表示してあげればいいのです。

画像サイズの追加方法は、画像アップロードで作成される画像の種類を追加するにて紹介してあります。

たとえば、横160px、縦120px、トリミング有りの large_thumbnail というサイズを追加するには、

add_image_size( 'large_thumbnail', 160, 120, true );

となります。

このサイズをアイキャッチ画像を表示するには、設定されているアイキャッチ画像のidが、カスタムフィールドの _thumbnail_id に格納されているので、get_post_meta( $post->ID, ‘_thumbnail_id’, true ); でidを取得し、、、

などとやることも可能なのですが、もっと簡単に表示させることもできます。
アイキャッチ画像を表示する the_post_thumbnail関数は、引数でサイズを指定することも可能なので、

この記事は、jim912によって書かれたものです。
引用を行う場合は、著作権法に定める範囲にて、引用元であるSimple Colorsの出展元表示とhttp://www.warna.info/archives/993/へのリンクを必ず行って下さい。

the_post_thumbnail( 'large_thumbnail' );

と指定すれば、一発で異なるサイズのアイキャッチ画像を表示することも可能なのです。

カテゴリー: WordPressの小技 タグ: , , パーマリンク

WordPressのアイキャッチ画像を複数サイズ表示させる への1件のフィードバック

  1. ピンバック: どうやってもアイキャッチ画像をリサイズできないときは画像そのものが原因かも | ヒキノート

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です