WordPressでアイキャッチ画像が表示されない場合の対処法

なあなあ。アイキャッチ画像が記事一覧画面に表示されないんやけど、どうしたらいいんや？

アイキャッチ画像が表示されない原因はいくつかあるよ。１つずつ確認していこう。原因がわかれば対処は簡単だよ

アイキャッチ画像が表示されない原因は大きく分けて次の２つになります。

それぞれの原因に合わせた対処を行う必要があります。それでは、対処法を見ていきましょう。

アイキャッチ画像の設定を忘れている時の対処法

まずはアイキャッチ画像がちゃんと設定されているか確認しよう。

記事の投稿編集画面で確認を行います。

まずは、WordPress管理画面へログインし、投稿 ≫ 投稿一覧をクリックしてください。

そして、記事の投稿編集画面を開きます。

通常であれば、アイキャッチ画像の設定ボックスが右側の列の下の方にあります。

このボックスにアイキャッチ画像が設定されているか確認を行ってください。

設定されていない場合は次のようになっています。

もし、アイキャッチ画像の設定を忘れているだけだったら、設定すれば表示されるようになるはずです。

…アイキャッチ画像のボックスがないんやけど

そういう時は、まず次の手順を試してみてね

アイキャッチ画像の設定ボックスが表示されていない時の対処法

WordPress管理画面の各画面には表示オプションがあります。

表示オプションは、その画面で特定の項目の表示非表示を選択できるものです。

投稿一覧の表示オプションを見てみましょう。

もし、アイキャッチ画像のボックスが表示されていないなら、アイキャッチ画像の項目にチェックは入っていません。

これにチェックをつければ、アイキャッチ画像のボックスが表示されるようになります。

あれ、わいのアイキャッチ画像の項目がないで？？

それは珍しいけど、テーマがアイキャッチ画像の機能を提供していないケースだね

テーマがアイキャッチ画像の設定をサポートしていない時の対処法

テーマがアイキャッチ画像の設定をサポートしていない時は、WordPressのソースコードを編集する必要があります。編集する際は、必ずバックアップをとってから編集を行うようにしましょう。

まずは、functions.phpファイルに次のコードを追加してください。これで、テーマがアイキャッチ画像の設定機能をサポートするようになります。

add_theme_support( 'post-thumbnails' );

上に記したコードを追加すれば、投稿編集画面でアイキャッチ画像の設定ボックスは表示されるようになります。しかし、まだアイキャッチ画像は表示されないままのはずです。

それはアイキャッチ画像を表示するコードがないからです。次のコードをアイキャッチ画像を表示したい箇所に挿入してください。

<?php the_post_thumbnail(); ?>

これでアイキャッチ画像は表示されるようになるはずです。もし、編集したいファイルがわからない場合、WordPressでカスタマイズするテンプレートを確認する方法の記事を参考にしてください。

表示されるアイキャッチ画像のサイズが大きすぎる場合、サイズを変更しよう

アイキャッチ画像のサイズを変更する

アイキャッチ画像のサイズを変更する方法は２種類あります。

1. set_post_thumbnail_size()で指定する方法
2. the_post_thumbnail()に指定する方法

２つとも行った場合、the_post_thumbnail()に指定する方法が優先されます。サイズの変更がうまくいかない方は確認してみてください。

set_post_thumbnail_size()で指定する

この方法は、functions.phpファイルを編集します。次のコードをfunctions.phpファイルに追加してください。

set_post_thumbnail_size( 100, 100 );

()の中に書いてある数字は任意で指定できます。前から順番にアイキャッチ画像の幅、高さになります。

詳しくは、WordPress Codexのset_post_thumbnail_size()の関数リファレンスに載ってます。

the_post_thumbnail()に指定する

この方法は、the_post_thumbnail()の()の中にアイキャッチ画像のサイズを指定する方法になります。

いくつか指定の方法がありますが、簡単に行える方法を紹介します。それは()の中にarray( 100, 100)と入力する方法です。

<php the_post_thumbnail( array( 100, 100 ) ); ?>

array( 100, 100)にある２つの数字は任意で指定できます。前から順番にアイキャッチ画像の幅、高さになります。好みのサイズに合わせて数字を入力してください。

アイキャッチ画像を設定できるようになったら、デフォルトのアイキャッチ画像を設定しておくがおすすめやで