勘弁してくれよ!Firelight Lightbox(旧 Easy Fancybox) 対応方法 解決したぜ

勘弁してくれよ!Firelight Lightbox(旧 Easy Fancybox) 対応方法 解決したぜ

記事
IT・テクノロジー
こんにちは!今回は、わたしのブログ記事「WordPressユーザー必見!Lightningで動かせるおすすめプラグインまとめ」でも紹介していたFirelight Lightbox(旧 Easy Fancybox)について、アップデート後に発生した問題と、その解決方法をシェアします。

問題発生!アップデートで想定外の挙動に…

Firelight Lightboxは、以前はメディアファイルにリンクしている画像だけがライトボックスで表示される便利なプラグインでした。
ところが!アップデートで仕様が変わり、リンク設定していないすべての画像が勝手にリンクされるという事態に…。これ、どういうことかというと、装飾用の画像をクリックすると、「無のページ」に飛んでしまうんです。(実際には透過したアイコンが見えないので無に見えるページ)

さらに厄介なのは、すでに納品済みの制作物にも影響が出たこと。私の手を離れたプロジェクトについても、この変更が適用されてしまい、頭を抱えました…。

対応策を確立しました!

試行錯誤の末、ようやく解決策を見つけました!以下の手順で元の動作に戻すことができます。

解決手順
1. Firelight Lightboxの設定画面を開きます。
2. 設定項目の「対象画像」を「すべての画像」から「すべての画像リンク」に変更します。
3. 変更を保存すれば完了!これで、リンク設定していない画像に勝手にリンクが付いてしまう問題が解消されます。
01.png

解決できてよかったけど…

有料プランにアップグレードしないと解決できないのかと思いましたが、無料版で対応可能だったので一安心。ただ、すでに納品した制作物については各方面にお詫びしながら修正対応を行っています…。

アップデートはするべき?

この騒動で「もう二度とアップデートしない!」と思う方もいるかもしれませんが、直近で脆弱性に対するアップデートもおこなわれているため、セキュリティの観点からはアップデートはしたほうがいいと思います。taneCREATIVEのちほうタイガーさんの記事によると、Firelight Lightboxは
人気のあるプラグインであるため、攻撃対象になりやすい側面もあります
とのことです。詳しく書いてあるのでぜひご参照ください。

WordPress 6.7.1の罠も発見!

ちなみに、この問題を調査中に、自社サイトのCSSに謎のコードを見つけました。
<style>img:is([sizes="auto" i], [sizes^="auto," i]) { contain-intrinsic-size: 3000px 1500px }</style>
これが原因でサイトが崩れる事態に!最初はFirelight Lightboxのせいかと思いましたが(疑ってゴメンネ)実際にはWordPress 6.7.1のアップデートが原因でした。
このコードが<title>タグ直後に挿入されていたのですが、SEO的にどうなの…?場所を考えてほしいですね。

もしアスペクト比を使用しているサイトをお持ちの方は、崩れがないか確認してみてください!
解決方法については株式会社オンズの原さんの記事などをご参照ください。わたしも次回の制作から参考に取り込んでいく予定です。

最後に

「マジ勘弁!」と思った方は、ぜひコメントやDMで愚痴を聞かせてください。一緒に慰め合いましょう。この記事が少しでもお役に立ったら、ハートボタンを押していただけると嬉しいです!

サービス数40万件のスキルマーケット、あなたにぴったりのサービスを探す ココナラコンテンツマーケット ノウハウ記事・テンプレート・デザイン素材はこちら