画像圧縮プラグイン「Smush」を入れたら、スクロールのたびに画面がカックンとズレる…。 私もこの症状で悩みましたが、原因と解決を見つけたので共有します（Before/After付き）。
チャットロンの解説：原因はLazy Loadの競合
ポイント
- SmushのLazy Load（遅延読み込み）が、読み込み前に画像の高さを確保できずレイアウトが後からズレる。
- テーマ（例：Cocoon）や他プラグインにもLazy Loadがあると二重で動いてズレやすい。
- CSSで高さが固定されていないとズレが増幅。
つまり、SmushのLazy LoadをOFFにすると症状は止まるケースが多いです。
チャットロン
つまり、SmushのLazy LoadをOFFにすると症状は止まるケースが多いです。
さっちん
ほんま、こんなん初心者にはわからん。
解決までの道のり（体験談）
- まずはCocoon設定を総点検 → 画像/スクロール関連に該当なし。
- 「スクロールをオフにして」と言われても、該当チェックが見つからず迷子。
- プラグインを1つずつOFF→ONで切り分け → Smushを外した瞬間にカックン停止。
- Smush内の設定を深掘り → ページ最下部にあるLazy Load無効化ボタンを発見。
さっちん
チャットロン、無いよ無いよ。チェックボックスが見つからないよ。
さっちん
やっと原因見つけた！スクロールカックン。ホントに苦労したけど原因わかって良かったわ。
すっきり♡
Before（カックンしている様子）
After（スムーズにスクロール）
操作手順：SmushでLazy Loadを無効化
- WordPress管理画面 → Smush → Lazy Load & Preload を開く。
- ページ最下部までスクロール。
- 「無効化（Deactivate）」ボタンをクリック → 保存。
無効化後の状態
再発予防チェックリスト
- SmushのLazy LoadはOFFのまま。
- 他プラグイン（LiteSpeed Cache, Jetpackなど）のLazy LoadもOFFを確認。
- 新しいプラグイン導入時は、Lazy Load機能の有無を必ずチェック。
- 変更後は実ページでスクロールテスト（カックンが無いか確認）。
まとめ
チャットロン
Smushの画像圧縮は活かしつつ、Lazy LoadだけOFFにすれば表示はスムーズに。 同じ症状で困っていた方は、まずは本記事の手順を試してみてください。
🌸著者の一言
ほんまに初心者にはわからない事ばかり。wordpressの設定ばっかりやってます(;^ω^)
(/・ω・)/こんな事にも困りました。
コーナーストーンコンテンツが出てきた理由と使い方
介護福祉士として13年。防災や終活にも関心あり。
在宅ワークを目指して、パソコン奮闘中の「さっちん」です！
コメント