WordPressでアイキャッチ画像の活用【1】有効化と表示方法

アイキャッチ画像
WordPressカテゴリー
Pocket

各投稿や個別ページ毎にアイキャッチ画像を設定することができます。 これを表示できるようにしておくことで、アイキャッチ画像を簡単に活用することができるようになります。

アイキャッチ画像の有効化

ご利用のテーマで、投稿・ページ編集画面にアイキャッチ画像を設定するメタボックスが表示されていない場合は、アイキャッチ画像が有効になっていません。

function.php に以下の記述がないか確認してください。もしも記述がない場合は一番最後に追記して更新してください。

add_theme_support( 'post-thumbnails' );

これで、アイキャッチ画像が有効になりました。 

アイキャッチ画像の設定

次に管理画面を開き、「投稿」へ移動します。
アイキャッチ画像を設定するメタボックスが表示されていない場合は、一番上の『表示オプション』をクリックして『オプション一覧』を表示させます。

新規投稿を追加する画面

『アイキャッチ画像』のチェックがありますので、チェックを入れます。
すると右カラムにアイキャッチ画像の設定欄が表示されます。

アイキャッチ画像を表示させる

アイキャッチ画像を表示したいページはそこから設定を行ってください。

アイキャッチ画像のアップロード投稿画面に設定したアイキャッチ画像のサムネイルが表示されます。
サムネイル画像の変更はその都度この場所でおこなってください。

設定したアイキャッチ画像

以上でアイキャッチ画像を使う準備は完了しましたが、このれだけではアイキャッチ画像は表示されません。

次に表示させたい場所にテンプレートタグを設定していきます。

アイキャッチ画像を表示させるタグ

アイキャッチ画像を表示するには、テンプレートタグ/the post thumbnail を使います。 アイキャッチ画像を表示したいテンプレートファイルに下記を記述します。

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

最初の has_post_thumnail() で、アイキャッチ画像の設定の有無を確認します。 アイキャッチ画像が設定されていた場合、the_post_thumbnail() で書き出します。 これでアイキャッチ画像が表示されるようになりました。