EWWW Image Optimizerが原因で画像が表示されない問題

概要

WordPressでブログをしているのですが、あるときサイトの画像が表示されないという問題が発生しました。

この問題を解決した方法について紹介します。

最初に、どのような問題が発生したのかについて整理します。

WordPressでは、記事などに画像を配置して表示することができるのですが、ある時を境に、画像が表示されなくなりました。

この問題は気づくまでにかなり時間がかかりました。WordPressの記事のプレビューではちゃんと画像が表示されていたため、それで安心してしまい実際の記事を確認していないのが理由です。

WordPressの生成するHTMLがおかしいのかと思い、HTMLを確認してみても、いまいち原因が分かりませんでした。しかしプレビューでは正常に動作しているため、もしかすると画像関係のプラグインが関係しているのではないかと思い、その線で問題について調べました。

調べたところ、私が画像の圧縮に利用している「EWWW Image Optimizer」が原因ということが分かりました。

EWWW Image Optimizerでは、WordPressにアップロードした画像などについて、なるべく画質を劣化させずにサイズを圧縮することができるプラグインです。設定が簡単でありながら、ページの読み込み速度の向上など効果が高く、私は手放せないプラグインとして利用しています。

EWWW Image Optimizerには、画像の遅延読み込みをして、ページ表示速度を向上させる機能があります。私の環境では、これが原因で今回の問題が発生していました。この設定を無効化することで問題は解決しました。

設定を無効化するには、WordPressの管理ダッシュボードから「設定」> 「EWWW Image Optimizer」に移動します。

移動後に表示されるページから、「遅延読み込み」のチェックを外し、ページの下にある「変更を保存」をクリックします。

これで設定は終わりです。設定後からちゃんと画像が表示されるようになりました。

このような問題が発生した原因として、遅延読み込み(Lazy Load)がありましたが、最近のWordPress本体でも機能として提供しており、さらにテーマでも遅延読み込みが機能として提供されていることが多いです。そのため、テーマやプラグインなどとの相性が関係しそうです。

プラグインを設定したときには、ちゃんと正常な動作をするのかしっかりと確認しましょう。最初は原因が全然分からず、解決までとても時間がかかりました。もっと早く気づいていれば、プラグインが原因だろうと的を絞って調査するため、解決まで時間があまりかからなかったと思っています。