この記事では、久々に当ワードプレスサイトで表示不具合が発生し、
その原因究明とどうやって解決したかを記録しています。
結論から言うと、よくありがちな
プラグイン同士の競合問題でしたが
ここでお伝えしたいのはその解決プロセスです。
なぜなら、解決プロセスを理解できると
似たような問題発生時に思い出すことで
何かと役に立つ可能性があるからです。
あれ!?スライダーが表示されない。。。
当ブログのトップページには本記事投稿時点では
ヘッダー領域にスライダーを活用しています。
ある時、ふと気が付いたのですがそのスライダー、
Chormeでは普通に表示されているのに
Firefox、Edgeなどで見るといつまでもクルクルと
待ち状態のまま表示されません。
ちょうどこんな感じです。
薄い格子部分は背景画像でして、そこに
83%の表示のままクルクルと待機状態を示しています。
そのうち100%になるかなと思っていても
ずっとこのままなので、明らかに変です。
それにしてもブラウザの種類で異なるのも変・・・
このスライダー部分は、厳密には
Smart Slider 3 Pro
というSmart Slider 3が無料版に対して
有料版のプラグインを使っています。
なぜ有料版かというと、ひとことで言うなら
芸が細かい(=多様な演出ができる)からです。
現状使いこなせていません、正直なところ。
それほどにきめ細かい演出可能であり、
そこに期待感があるのです。
もうひとつ理由があって、それが今回
非常に重宝したのですが、いわば
何かあったときのサポートがついていること。
これに助けられました。
とりあえず、Smart Slider 3 Pro専用のサポートフォームから
簡単な英語で(日本語使えないのはちょっと面倒ですが)
上に貼り付けたキャプチャ画像と、URLを伝えました。
これが2019年9月6日 21:50頃のことです。
まぁ、これで2,3日後に返信くればいいかな
くらいに思っておりました。
すると・・・
Smart Slider 3 Proサポートのメールが即行で来た!
ただ、来たのではなく詳細な手順を添えて
しかも私がサポートの依頼を出してから
たったの9分後です!!!
時差のため、日本時間のそのタイミングでは
仕事中のはずとはいえ、あまりの速さと中身にびっくり!
21:59にサポートメンバーの
Bernadett氏(名前表示可の確認済)から来た
メールを一部マスクしておりますが貼り付けます。
図中の赤で囲った部分は今回のポイントですが
ざっと要約すると、こんな感じです。
Bernadett氏のメールポイント
- どうやらJavaScriptに関係したエラーが発生している。
- とりあえずリリース済よりさらに最新のプラグインファイルを送るのでそれで試してくれ。現状のSmart Slider 3 Proを削除して、送ったzipファイルをアップロードし有効化すればよい。
- それでダメならプラグイン競合テストをして欲しい。
- プラグイン競合テストは、Smart Slider 3 Proだけを残して他のプラグインを一旦すべて無効にする。その状態でOKならひとつずつ有効化してどのプラグインが影響しているかを確認して欲しい。
ざっとこんな感じです。
これはサポート側の定型文のひとつかもしれませんが
わずか数分で当ブログのURLとキャプチャ画像を送っただけで
これだけの内容を送ってくれたことにビックリです。
眠気も覚めて、この指示通りに行ったところ
送ってくれた最新バージョンのプラグインでは解決できませんでした。
となると、プラグイン競合テストです。
この方法は一般論として、ワードプレスで何かおかしくなったら
普通にやってみる手順ですが今回、これで結果判明しました。
WP Fastest Cache Premiumとの競合!?
現在、このブログに使っているテーマはWING(AFFINGER5EX)
プラグイン競合というより、万一プラグインとテーマ間での競合だと面倒だな・・・
と思っていましたがそれは大丈夫でした。
一旦Smart Slider 3 Pro以外の全てのプラグインを無効化し、
そこで現象が解決するなら(実際、解決しました)
他のプラグインと競合していることになるわけです。
ひとつひとつプラグインを有効化するよりも
こういったケースで非常に多くあるケースが
キャッシュ系のプラグイン競合問題です。
真っ先に、WP Fastest Cacheというプラグイン及び
その拡張版(有料です)であるWP Fastest Cache Premiumの
2つを無効化しました。
すると、見事に問題解決されスライダー部分も
キレイに表示されています。
これで、少なくともWP Fastest Cacheと
Smart Slider 3 Proがどこかでバッティングして
JavaScriptエラーを引き起こしている、
その結果表示がうまくいかないということまでがわかりました。
WP Fastest Cache Premiumにある細かい設定が関係
WP Fastest Cacheとは、数あるプラグインの中で
私自身の考えでは最も安定していると思うキャッシュ系プラグインになります。
そこにさらに拡張性のある有料版、
WP Fastest Cache Premiumを使っているのは
ワードプレスサイトの高速化に欠かせない要素が
ほぼすべて含まれていると考えているためです。
以下にご紹介している無料レポートにも記載していますが、
ワードプレスサイトの爆速化にこのプレミアム版は大いに貢献しています。
-
メルぞう,e-Book大賞, 受賞作品,Wordpress 爆速化計画
ご案内:無料レポートについて 本ページでご紹介している無料レポートは、2023年10月メルぞうが「りすマケ」に統合されたことにより、以下のページに集約しております。 ふと気がついたら、私の無料レポート
続きを見る
さて、今回WP Fastest Cache Premiumの内部設定の一部に
原因があったのですが、結果的には元のままにしております。
その内部設定とは(プレミアム版限定です)
前記の図中で赤で囲った箇所が
JavaScriptの制御に関わるところです。
厳密にはこれらのチェックを外すことで
問題が解消されることを突き止めました。
では、WP Fastest Cache Premiumが犯人?
というと必ずしもそうではありません。
実はこの数日間に、
- ワードプレステーマ(WING)のアップデート
- ワードプレスをWordPress 5.2.3にアップデート
- Smart Slider 3 Proのアップデート
- WP Fastest Cache Premiumのアップデート
と重ねて行ったため、これらを同時期にいろいろと
操作した結果、JavaScriptがうまく継承されていたブラウザ環境(Chrome)
では問題なく、ブラウザを変えて(FirefoxやEdgeへ)表示させたタイミングでは
JavaScriptがうまく機能していなかったということが原因です。
つまりそれぞれのアップデートの後で
JavaScriptを含めたキャッシュ削除
をキチンと行うことによって本来の姿に戻ったという話です。
ということでキャッシュ系プラグインそのものの不具合ではなく
キャッシュが残っている状態でワードプレス環境を変えたために
その残っていたキャッシュが影響を与えたということになります。
さらなるサポートありで追記
いやぁ・・・
前記のWP Fastest Cacheとの競合問題で解決しましたと
一応Smart Slider 3サポートメールへの御礼を返信したところ
これまた数分で返答が返ってきました。
・・・
なるほど、こういうやり方で解決もできるんだな、と
思ったと同時に、他社のプラグイン競合問題をよく研究しているなぁと
むしろそのことに感銘を受けました。
今度は、Ramonaという別メンバーですけど
顧客課題と対応について共有できているから
こういう返事がすぐさまできるのだなぁ・・・と
妙なところに感心しました。
で、早速ながらRamona氏の返事はこうです。
片付いたのならいいけど、
WP Fastest Cacheであればこういう手もあるよ、
というアドバイスですね。
具体的には、下図のように除外する対象に
nextendというドメインを追加するだけ。
WP Fastest Cache Premium自体が有名なことから
いろんな知見がたまっているのだと推察できます。
いやぁ。。。(二度目)
ここまで・・・他社のプラグインの設定まで
細かく説明してくれたのは初めてです。
しかも数分以内に(笑)
このようなサポート体制を体感できると
やっぱり有料版で大正解だったと
つくづく思います。