こんにちは!みいちゃんです!!
今回の記事は
スマホで新着記事のみが真っ白になってしまった時の対処法
について紹介していきます。
使用環境・状況
使用環境
テーマ:Affinger
状況
・PCでは通常どおり表示される
・モバイルで見るとトップページの新着記事(スライダー)の部分のみ真っ白になっている。他の部分はモバイルでも見える。
「スライダー」とはこのように記事が自動で横にスライドしてくれるものです。
これがスマホやiPadなどのモバイルではこのようになってしまいました・・・
なぜ起こったのか?
サイトが重くてあらゆることを実施していた
SEOやユーザビリティを考えても、サイトの速度の高速化は大切です。
この「みいちゃんBlog」はトップページをカスタマイズしたあたりから、サイトの速度が遅くなってしまいました。
これをどうにか解消しようと、いろんなサイトで調べてたんです!
サイト高速化のために実施したこと
・画像圧縮
・HTML、CSS、JavaScript圧縮のためプラグイン「Autoptimize」導入
・重ためのプラグイン「All in one SEO」削除
・JavaScriptを非同期、遅延読み込みをさせるプラグイン「Async JavaScript」導入
・キャッシュ系プラグイン「W3 TOTAL CACHE」導入
キャッシュ系プラグインを導入
サイトの高速化にはキャッシュ系プラグインがいい!!
この言葉にさそわれて、早速インストールしてみました。ちなみにわたしは「W3 TOTAL CACHE」を入れました。
設定が終わったあとは、サイトの速度が速くなったような気がして喜んでいました!ですが・・・
あれ??スマホの新着記事が消えて真っ白になってる・・・!!
しかもさっきまで早いと思っていたサイトの速度、むしろ遅くなってないか!?
ここからわたしのパニック劇場が始まります・・・
解決策
キャッシュ系プラグインを削除
削除してみよう・・・
せっかく入れたのに、サイトの速度も速くならなかったので迷わず削除しました!
ただこのキャッシュ系プラグイン、削除する際にも注意が必要です。設定をきちんと行わないと、不具合が生じるみたいなので気をつけて下さい!!
わたしが参考にさせていただいたのはこちらです。
「キャッシュ系プラグインW3 Total Cacheの安全な削除方法」
プラグインの削除はできました!さっそくスマホで確認してみます!!
どうやらキャッシュ系プラグインだけが原因じゃないようです。
新着記事のスライダーをやめた
トップページの新着記事を「カテゴリー一覧(スライドショー)」をやめて、「カテゴリ一覧」に変更してみました。
おぉ!!直ったー!!スマホも新着記事がちゃんと表示されてる!
なんだか表示速度も速くなったような気がする!
スライダーとAffingerが相性が悪かったのかな?と思いました。
速度も「PageSpeed Insights」で測ってみたところ、数値は低いものの前回よりも改善していました。
<前回>
<改善後>
また別のトラブル
一難去ってまた一難とはこのことなんだと痛感しました(笑)
今度はスマホのハンバーガーメニューが開きません。
ハンバーガーメニューとはこの部分のことですね。クリックするとメニューが開きます。
長くなりそうなので、こちらの記事にまとめたいと思います。
-
スマホでハンバーガーメニューが開かない!わたしが取った対処法
続きを見る
まとめ
・キャッシュ系プラグインを削除する
・新着記事のスライダーをやめてみる
ぜひ試してみて下さい!!
ポチッと応援お願いします!