【Cocoon】「CSSを縮小化」で、画像が表示されないときの対処法

Cocoonの設定で「CSSを縮小化」をONにするとアイキャッチが表示されないという問題が発生しました。

この記事ではその対処法をご紹介します。

確認すべき設定

画像が表示されない原因は、画像を最適化してサイトを高速化するプラグイン「EWWW Image Optimazer」の「Lazy Load(遅延読み込み)」設定でした。

EWWW Image Optimizerの設定画面を開き、

「画像が表示領域に入った (または入ろうとしている) 時にだけ読み込まれるため、読み込み速度を改善します。」のチェックを外すとアイキャッチが表示されるようになります！

チェックを外すと、無事アイキャッチが表示されました！

EWWW Image Optimazerの方で画像の遅延読み込みをOFFにしたので、Cocoonの設定で遅延読み込みをONにしたいと思います。(WordPress 5.5からLazy Loadが標準機能になりました。)

「CSSの縮小化」にチェックをつけた状態で、

下の方にある「Lazy Loadを有効にする」にもチェックをつけます。

これで設定は完了です！