BLOG
ブログ

WordPressのアイキャッチ画像を使う

WordPress 2.9から追加された機能「アイキャッチ画像」。利用するにはいくつかやることがあるので簡単にまとめておきます。

機能としては、1つの記事に対して画像を1枚アップできるというもの。今までであればカスタムフィールドを使っていたと思いますが、専用のフォームが用意されました。しかも指定したサイズで画像の縮小、または切り抜きができて便利。

設定方法

テーマ内にある「function.php」に下記を追加します。

<?php
add_theme_support( 'post-thumbnails' );
set_post_thumbnail_size( 150, 80, true );
?>

この場合、画像を縮小してぴったり横150px、縦80pxに切り抜きます。

関数「set_post_thumbnail_size」の3つ目の引数「true」が重要。これがあると指定のサイズぴったりの画像が作られます。もちろん縦横比が歪むことなく、左右または上下が切り取られます。もしこれがない場合はオリジナル画像の縦横比のまま、指定サイズを上限に収まるように縮小します。

アイキャッチ画像を正方形にしたい場合は、縦横の数字を同じとし、3つ目を「true」とします。長方形の画像をアップしても正方形になります。

「function.php」にこの2行を追加したら、新規投稿画面の右カラムに「アイキャッチ画像」という項目が表示されていることを確認。

アイキャッチ画像の表示

<?php
if ( has_post_thumbnail() ) the_post_thumbnail();
else { ... }
?>

ループ内に記述します。
「else」の行は任意。アイキャッチ画像がなかった場合の処理です。

留意点

  • アイキャッチ画像をアップする際、既にアップされた画像(メディアライブラリなど)から選んでも切り抜かれないようです。もし同じ画像がアップされていても再度アイキャッチ用にアップしましょう。逆にアイキャッチ用にアップした画像は、記事の中で他のサイズも使用できます。
  • 切り抜きを設定する場合、画像の左右か上下がなくなるので、撮影時点で構図に注意。また切り抜いた画像は、将来のデザイン変更で利用できなくなるので設計は慎重に。