WordPress

LiteSpeed Cache導入とreCaptchaのContact Form 7不具合解決

2022年8月31日

スピード

SEOに影響するウェブサイトの表示速度。「LiteSpeed Cache」の導入で表示速度が大幅にアップしました。また「Contact Form 7」の不具合も解決できましたので情報を共有します。

AFFINGER6(ACTION)のLiteSpeed Cache導入前、導入後

2022年5月12日、ロリポップから「ウェブサイトの速度が2倍になる「LiteSpeed Cache」が利用できるようになりました!」とのお知らせがありましたので、「LiteSpeed Cache」を導入してみました。

ウェブサイトのさらなる爆速化を実現する「LiteSpeed Cache」が利用できるようになりました! - 2022年05月12日 / 新着情報 / お知らせ - ロリポップ!レンタルサーバー
ウェブサイトのさらなる爆速化を実現する「LiteSpeed Cache」が利用できるようになりました! - 2022年05月12日 / 新着情報 / お知らせ - ロリポップ!レンタルサーバー

ロリポップ!レンタルサーバー 2022年05月12日 新着情報「ウェブサイトのさらなる爆速化を実現する「LiteSpeed Cache」が利用できるようになりました!」についてのページです。

lolipop.jp

サイト環境LiteSpeed Cache導入前LiteSpeed Cache導入後
レンタルサーバーロリポップハイスピードプラン同左
2022年5月12日LiteSpeed Cacheに対応
WordPressテーマAFFINGER6同左
AFFINGER6の設定・キャッシュ機能なし
・遅延読込(LazyLoad)使用しない
・Googleフォント使用しない
同左
スピードアッププラグインWP Fastest Cache(キャッシュ)
Autoptimize(ページ最適化)
EWWW Image Optimizer(画像圧縮)
Imsanity(画像サイズ修正)
LiteSpeed Cache(キャッシュ、画像最適化、ページ最適化、データベース最適化)
reCaptcha設定プラグインInvisible reCaptcha for WordPressreCaptcha by BestWebSoft
PageSpeed Insightsスコアモバイル50~60点台
パソコン90点台
モバイル80~90点台
パソコン90~100点

AFFINGER6の設定(参考)

  • 遅延読込(LazyLoad)を使用しない設定(WordPressに同機能があるので)
    • 「AFFINGER管理」「その他」「遅延読込」「WordPress本体のLazyLoadを有効にする」ON
  • Googleフォントを使用しない設定(読み込みが遅くなるので)
    • 「AFFINGER管理」「全体設定」「Aフォントの種類」「全体」「デフォルト」ON(初期設定のままでGoogleフォントを使用しない設定)
    • 「AFFINGER管理」「全体設定」「Aフォントの種類」「記事タイトル・見出し…」「使用しない」ON(初期設定では「Noto Sans」ONでGoogleフォントを使用する設定)
    • 上記設定でAFFINGER標準の通常フォント「メイリオ」になる
  • 「AFFINGER管理」の設定変更注意点
    • 事前にロリポップのWAF設定を「無効にする」にしておかないと「AFFINGER管理」の設定変更はできません(設定変更後、WAF設定を「有効」に戻す)

「LiteSpeed Cache」導入前もそこそこのスピードアップ対策は行ってましたが、モバイルのPageSpeed Insightsスコアはせいぜいいっても60点台といったところでした。

それが「LiteSpeed Cache」導入後はモバイルでも80~90点台、時に100点を打ち出すまでに表示速度が大幅にアップしました。

AdSense広告を貼ってるこのページの表示速度。↓(良い時で)

このページのモバイルの表示速度98点
このページのパソコンの表示速度100点

表示速度を大幅アップできる「ロリポップハイスピードプラン」と「AFFINGER6」について詳しくはこちら。↓(おすすめです)

LightningのLiteSpeed Cache導入前、導入後

WordPressテーマ「Lightning」で作った下記ホームページにも「LiteSpeed Cache」を導入しましたので、こちらも参考に載せておきます。

Lightningで作成
齋藤富智恵税理士事務所【玉村町・伊勢崎市・前橋市・高崎市】
齋藤富智恵税理士事務所【玉村町・伊勢崎市・前橋市・高崎市】

玉村町の女性税理士

fujiekaikei.com

サイト環境LiteSpeed Cache導入前LiteSpeed Cache導入後
レンタルサーバーロリポップハイスピードプラン同左
2022年5月12日LiteSpeed Cacheに対応
WordPressテーマLightning同左
スピードアッププラグインEWWW Image Optimizer(画像圧縮)LiteSpeed Cache(キャッシュ、画像最適化、ページ最適化、データベース最適化)
reCaptcha設定プラグインInvisible reCaptcha for WordPressreCaptcha by BestWebSoft
PageSpeed Insightsスコアモバイル70点台
パソコン90点台
モバイル100点
パソコン100点

もともとWordPressテーマ「Lightning」は名前の通り軽いので「LiteSpeed Cache」導入前からそこそこの表示速度を打ち出していましたが、「LiteSpeed Cache」導入後はなんとモバイル、パソコンともにPageSpeed Insightsスコア100点をたたき出しました。(恐るべし)

トップページの表示速度。↓(安定して)

トップページのモバイルの表示速度100点
トップページのパソコンの表示速度100点

LiteSpeed Cacheの設定方法

LiteSpeed Cacheの設定は以下の記事を参考にさせて頂きました。(こちらの記事のおかげで無事に設定することができました。本当にありがとうございます。)

LiteSpeed Cacheの設定方法と不具合対処【WordPress高速化、mixhost、カラフルボックス】 | マニュオン
LiteSpeed Cacheの設定方法と不具合対処【WordPress高速化、mixhost、カラフルボックス】 | マニュオン

この記事では、プラグイン「LiteSpeed Cache(ライトスピード キャッシュ)」で不具合の少ないおすすめの初期設定の方法と使い方を、画像を用いてわかりやすくご紹介します。 「LiteSpeed ...

manuon.com

  • 記事に記載されている通りに設定しましたが、デザイン崩れもなく表示速度が大幅アップしました。(この後書きますが「Contact Form 7」の不具合は別のプラグインが原因でした)
  • キャッシュの除外の「URIs をキャッシュしない」何も設定してませんが、私のお問い合わせフォームでは問題ありませんでした。(この後書きます「Contact Form 7」の不具合とも関係ありませんでした)
  • ページの最適化のHTMLの設定の「DNSプリフェッチ」はWordPressテーマ「AFFINGER6」がどうなっているのか分かりませんでしたが、記載通り「//www.google-analytics.com」「//www.googletagmanager.com」の2つを設定しました。(WordPressテーマ「Lightning」はPageSpeed Insightsスコアが100点なのでこちらは設定していません)
  • クローラーをオンにできるかはサーバーによると記載されていたので、ロリポップのサポートに確認したところ、ロリポップでは「LiteSpeed Cache」の利用に制限は設けていないのでオンにできるとの事でしたので、こちらはオンにしてます
  • 「LiteSpeed Cache」導入後に「Contact Form 7」で以下のメッセージが表示されない不具合を発見しましたが、原因は「LiteSpeed Cache」ではなく「Invisible reCaptcha for WordPress」でした。以下に解決方法を記載します。
  • 必須項目が未入力の時に出るメッセージ
    「入力内容に問題があります。確認して再度お試しください。」(黄色枠)
  • 送信が完了した時に出るメッセージ
    「ありがとうございます。メッセージは送信されました。」(緑枠)

Contact Form 7の不具合を解決する方法

「Contact Form 7」でメッセージが表示されない不具合の解決方法は以下の記事を参考にさせて頂きました。(こちらの記事がなければ永久に未解決状態でした。本当にありがとうございます。)

Contact Form 7 でメッセージが表示されない | ITO・BPO Outsourcing | 質の高いアウトソーシングを当たり前に
Contact Form 7 でメッセージが表示されない | ITO・BPO Outsourcing | 質の高いアウトソーシングを当たり前に

WordPressの国産プラグインであるContactForm7で、突然メッセージが表示されなくなったら試してほしいこと

boogaloo.jp

  • 「reCaptcha by BestWebSoft」を導入すると「Contact Form 7」の不具合が解決します
  • 「LiteSpeed Cache」の影響か分かりませんが、「reCaptcha by BestWebSoft」の初期設定でWordPressのログインにreCaptchaを適用するとWordPressのログイン時にreCaptchaにはじかれてログインできなくなります。(「Chrome」でログイン画面を開いていましたが、かなり焦りました。試しに「Edge」でログイン画面を開いたらログインできたので、あわててWordPressのログインからreCaptchaをはずしました。)

Contact Form 7の不具合を解決できなかった方法

参考までに私が試して解決できなかった方法も載せておきます。最初から「reCaptcha by BestWebSoft」が入っていれば不具合はなかったのですが、私の場合「Invisible reCaptcha for WordPress」だったので解決方法が分かるまでかなり手こずりました。

原因が「Invisible reCaptcha for WordPress」と気づく前

上記解決方法の記事にたどり着く前は、「LiteSpeed Cache」導入後に不具合に気づいたので「LiteSpeed Cache」が原因だと思い込んで以下の方法を試しましたが解決できませんでした。

  • LiteSpeed Cacheの設定の参考にさせて頂いた記事に記載のあったキャッシュの除外「URIs をキャッシュしない」「^contact$」を設定してみる。
  • LiteSpeed Cacheの設定を他のサイトで紹介されている設定に変更してみる。
  • キャッシュ(サーバー、プラグイン、ブラウザ)を削除して、パーマリンクを更新してみる。

原因が「Invisible reCaptcha for WordPress」と気づいた後

上記解決方法の記事にたどり着いた後もその記事通りに「reCaptcha by BestWebSoft」を入れずに以下の方法を試したので解決できず、解決までに遠回りしてしまいました。

原因が「Invisible reCaptcha for WordPress」だと分かったので「Invisible reCaptcha for WordPress」を停止(「Contact Form 7」が正常に戻る)して以下の方法を試しました。

  • 「Google reCAPTCHA V3」のキーをオーソドックスに「Contact Form 7」に直接設定してみる。
    ⇒この方法だと「メッセージの送信に失敗しました。後でまたお試しください。」(オレンジ枠)のメッセージが出て送信自体ができませんでした。(なぜか「Edge」だと送信できます)
  • 上記送信失敗のメッセージがオレンジ枠の場合、reCaptchaにスパム判定されているので「Google reCAPTCHA V3」のキーを再取得して「Contact Form 7」に再設定すると直ることがあると書かれた記事があったので試してみました。
    ⇒この方法だと一時的に「Contact Form 7」が正常に戻りますが、翌日には上記と同じ症状が出て送信できなくなっていました。(気づかぬうちに元通りは怖いです)

まとめ

最終的には「LiteSpeed Cache」で表示速度がアップ(SEOに有利)して「Contact Form 7」の不具合も直せたので良かったですが、かなり手こずりました。「LiteSpeed Cache」の導入を検討している方や「Contact Form 7」の不具合で困っている方のお役に立てればうれしいです。

アクセスランキング

書き方チェック 1

令和3年10月から申請受付が始まるインボイス制度の登録申請書。経過措置や特例によって書き方が多少分かりにくくなっています。(様式も複数) そこで今回は、そんなインボイス制度の登録申請書の書き方について ...

インボイス手続? 2

インボイスの交付に必要な登録申請手続。やめるのに必要な取りやめ手続。手続関係は適用時期にかかわるので税務上特に重要ですが、経過措置や特例が多いので全体像や違いがつかみづらくなっています。 そこで今回は ...

家族は一緒 3

個人事業の場合、夫の建物の一部を妻が事務所や店舗に使うなど、夫や妻の資産を事業に使うことはよくあることですが、所得税ではこの「同一生計親族間」のやり取りに対して経費の「特別ルール」を設けています。知ら ...

Check List 4

消費税率10%引上げ時に期間限定で控除期間13年の特例が創設されましたが、その後、コロナ特例、令和3年度税制改正によりその期限が延長されました。 そこで今回は3種類ある控除期間13年の特例について違い ...

消費税率が5%、8%、10%とアップ。住宅ローン控除もそれにともないアップ。 5

年末調整や確定申告で出てくる住宅ローン控除の「特定取得」と「特別特定取得」。どこがどう違うのか、いまいち全体像がつかめないという方も多いのではないでしょうか。 そこで今回は特定取得と特別特定取得につい ...

どう変わる? 6

令和4年度税制改正で住宅ローン控除の適用期限が令和7年まで4年間延長されるとともに、その中身についても大幅な改正が行われました。 そこで今回は、令和4年から住宅ローン控除がどう変わるのか、改正の背景や ...

令和4年度改正 7

令和4年度税制改正で「免税事業者の適格請求書発行事業者の登録に関する経過措置」(以下「免税事業者の経過措置」)に関して適用期間の延長などの改正が行われました。 そこで今回は、その改正内容について「簡易 ...

-WordPress