【Cocoonテーマ】ヘッダー画像が一瞬表示されない(遅れて表示される)原因は

Cocoon customize

WordPressでCocoonテーマを利用しています。
テーマ利用当初は大丈夫だったのに、いつの頃からかヘッダー画像に遅延がおこり、
更新すると1、2秒ほどブログタイトルが真っ白になってしまう
現象が起こっていました。

私の環境の場合ではありますが、調べてみると、
犯人は「EWWW Image Optimizer」プラグインでした。

Cocoonテーマの公式サイトにも書かれてありますが、なかなか見つけにくいかもと思い、
同じような現象で困っている方のお役に立てればと書いてます。

スポンサーリンク

ヘッダー画像遅延に最初に気が付いた状態は

れこみんぐトップページ
↑読み込み前

れこみんぐ画像読み込み時の遅延↑再読み込み時に起こる画像読み込み遅延
メニューバーがびろーんと下に下がってしまう。

自分のブログを開いた時、更新を押した時、他のページに移動した時に、

ヘッダー画像がないままヘッダー部分の天地が画面の半分まで長くなり、グローバルメニューが下のほうにあるという気持ち悪い状態に。

一瞬だからいいかぁと解決せずにずるずるきましたが、
さすがに気になり探索の旅へ。

所有の同じCocoonテーマ使用の別ブログは綺麗にヘッダー表示されているので、
一体悪さをしているのはどこなのか。

考えられる設定をチェック

まずはCocoonの高速設定をチェック

Cocoonの高速化は設定していませんでした。

子テーマに書き込んだスタイルシートは?

念のため、子テーマに書き込んだCSSを
そのまま他のテストサイトに貼りつけましたが変化なし。

Cocoonの管理画面で微調節してみる

Cocoon管理画面でヘッダーの縦サイズを調節し、
なんとかびろーんと伸びるのは気にならないくらいには調節できました。
が、画像がビビっと動いてしまう違和感あり。ううむ・・・

Cocoon公式サイト内を検索

Cocoon公式サイト内でヘッダー関連をあれこれ検索していると・・・

ヘッダーロゴが表示されない」のページに
「EWWW Image Optimizer」 にも画像の遅延読み込み機能があるので、
有効になっていないかご確認ください。」とのコメントを発見。

「EWWW Image Optimizer」は
画像を圧縮して表示速度を高速化してくれるとても便利なプラグインです。

高速化が重複するとこういう不具合が出てしまうようです。
私の場合はまさにこれでした。

「EWWW Image Optimizer」の設定画面から
「遅延読み込み」のチェックをはずすと解消されました。

Cocoonの管理画面で微調節したものも元に戻し終了です。
よかった~(*^^*)

ちなみにCocoon設定での遅延読み込みも試してみましたが、
私の環境下では使わない方が表示が速いのでそのままにしています。

まだまだ奥が深いCocoonです。

 

Cocoonミニカスタマイズ、こちらもどうぞ。

【Cocoonテーマ】通知エリアのテキストを太字にしたい
Cocoonテーマのヘッダー下にある通知エリアのテキストを太文字にする方法です。

コメント