記事一覧のサムネイル画像が一部表示されなくなった場合の対処法

2018年1月22日

人生をシンプルにするサイトのトップページの画像

ワードプレスのサイトで、一部記事のサムネイル画像が表示されない現象が発生。解決までに実施したことを記録しておきます。

サムネイル画像が表示されなくなった

このブログの表示スピードを改善しようと、GoogleのPageSpeed Insightsと格闘中、トップページに異常が発生していることに気づきました。

それは・・・

人生をシンプルにするサイトのトップページの画像
一部記事のサムネイルが表示されない

画像のように「一部記事のサムネイル画像が壊れて表示できない」というもの。すぐに次の対策を行いました。

  1. 全記事のサムネイル画像を再作成:(プラグイン「Regenerate Thumbnails」を使用)
  2. サイトをバックアップから復元

まず最初に、サムネイル画像がおかしくなったのかな?とサムネイル画像を再作成しました。しかし、現象は改善されず。

変にいじくるより、その日1日の作業は無駄になってしまうけど、全部元に戻そう!とバックアップから1日前の状態を復元。

しかし表示されない。ブラウザのキャッシュをクリアしてもダメ、、、2日前の状態を復元してもダメ、、、どうしよう・・・((((;゚Д゚))))ドキドキ

デスクワークをしているイラスト画像
孤独な自問自答を2時間続けた

次に行ったのは、「検証」という作業。画像のリンクをチェックして検索バーに入力してみると、なんと404エラー表示。画像が消えてる?

検索しても出てこない、つまり画像がないので表示できない。

原因はわかった、ではどうすればいい?

キャッシュの設定を修正した

このサイトは、wpXレンタルサーバーで運営しているのですが、サーバー側のキャッシュ設定を無効にしました。

具体的には、

キャッシュ設定を無効化した画像
サーバーのキャッシュ設定を無効に

画像のように、設定「OFF」をクリックしただけ。その後、再度ブログを表示させてみると・・・

人生をシンプルにするサイトのトップページの画像
サムネイル画像が表示された

あれ?表示されてる!

このキャッシュ設定を有効にしても、GoogleのPageSpeed Insightsでテストすると、「キャッシュ設定を有効にしてください」と表示されてしまうので、独自に調べて「.htaccess」を編集していました。「wpx」と「.htaccess」の両方で設定したのがまずかったよう。

wpxの設定を「OFF」にしたことで、希望通りの動作をするようになりました。メデタシメデタシ!

まとめ

サムネイル画像がおかしくなった場合の対処法まとめ。

  1. 表示すべきサムネイル画像があるか確認する
  2. サムネイル画像を再度作成
  3. キャッシュ設定を一旦無効にし、改善されたら有効化する

この手順で行ってみてください。悪戦苦闘しましたので、同じようにお困りの方のために記事にしておきます。