WP-Search
キーワードコンソール
SEOキーワードツール
この記事では、WordPressプラグイン「W3 Total Cache」で不具合の少ないおすすめの初期設定の方法と使い方を、画像を用いてわかりやすくご紹介します。
「W3 Total Cache(ダブルスリー トータル キャッシュ)」は、多くの種類のキャッシュ機能を提供する高機能プラグインです。
レンタルサーバーだけでなく、VSP、AWSなどのクラウド、CloudFrontなどのCDNにも利用しやすいです。
データベースキャッシュなどもありますが、不具合に注意してください。
なるほど!気をつけます。
この記事を最後まで読めば、WordPress(ワードプレス)を高速化できます。
ぜひ最後まで進めてみてください。
最初に高速化プラグイン(キャッシュプラグイン)の選び方を簡単に解説しておきます。
WordPress高速化プラグインで、表示速度No1は圧倒的な差をつけて「WP Rocket」です。
有料ですが高速テーマSWELL
LiteSpeedを採用しているレンタルサーバーは、無料で「LiteSpeed Cache」が使えます。
画像のWebP化や投稿リビジョン削除なども可能なので、これ1つで他のプラグインを減らすことができます。
LiteSpeed以外のレンタルサーバーで、投稿リビジョン削除も行いたい場合は、「WP-Optimize」がおすすめです。
投稿リビジョンなどのデータベースは高速化のボトルネックになりやすいため、定期的な削除が推奨されます。
「WP Fastest Cache」は、モバイルキャッシュ機能が有料版(Premium版)のみになります。
そのため、完全レスポンシブ対応のテーマ以外はおすすめできません。
たとえば、SWELL
「WP Super Cache」は、設定画面が難しいために間違って設定する人が多いようです。
無料ですが、初心者向けではないかもしれません。
ページキャッシュ以外のさまざまなキャッシュ機能やCDNを利用したい場合は「W3 Total Cache」が便利です。
高機能なのでレンタルサーバーだけでなく、VPSやクラウドサービスにも使いやすいです。
「Autoptimize」は、キャッシュプラグインと組み合わせて使うこともできる最適化プラグインです。
CSS・JS・HTMLの最適化・縮小化などは不具合が生じることが多いですが、「Autoptimize」だと不具合が出ない場合もあります。
各プラグインの機能の違いは、以下をご覧ください。
WP Rocket | LiteSpeed Cache | WP-Optimize | WP Fastest Cache | WP Super Cache | W3 Total Cache | Autoptimize | |
---|---|---|---|---|---|---|---|
ページキャッシュ | |||||||
モバイルキャッシュ | |||||||
オブジェクトキャッシュ | |||||||
データベースキャッシュ | |||||||
ブラウザキャッシュ | |||||||
CSS/JS/HTML最適化 | |||||||
JS遅延読み込み | |||||||
画像WebP化 | 有料 | 有料 | オンザフライ | ||||
画像遅延読み込み | 有料 | 有料 | |||||
リンクプリロード | |||||||
データベース最適化 | 自動 | 手動 | 自動 | 有料 | |||
CDN | 簡易 | QUIC.cloud | 簡易 | 簡易 | 高機能 | ||
Heartbeat制御 | |||||||
料金 | 有料 | 無料 | 無料 | 無料 | 無料 | 無料 | 無料 |
詳しく | 詳しく | 詳しく | 詳しく | 詳しく | 詳しく | 詳しく |
画像の圧縮やWebP化を行いたい場合は、「EWWW Image Optimizer」もあります。
特に画像のWebP化は高速化に有利になるため、機能が不足する場合は導入しましょう。
どのプラグインを入れるか決まったら、早速インストールしていきます。
作業を開始する前に、サーバーでバックアップを取得しておくことをおすすめします。
表示速度の変化を確認したい場合、現在の状態を「PageSpeed Insights」で計測しておきましょう。
ただし、計測値と体感のスピードは違いますので、実際の挙動確認もお忘れなく。
WordPress(ワードプレス)にログインしたら、左メニューの[プラグイン]→[新規追加]をクリックして、[プラグインの検索]をします。
[プラグイン]→[新規追加]から「W3 Total Cache」を検索して、[今すぐインストール]した後に[有効化]します。
左メニューの[パフォーマンス]をクリックすると、[セットアップガイド]が開きます。
セットアップガイドでは、各種キャッシュ設定のテストを行ってくれます。
最初に、W3 Total Cacheのデータ収集を止めたい場合は[Decline]を選択して[NEXT]をクリックします。
過去に他のキャッシュプラグインを利用していた場合に表示されることがあります。
[はい、削除してください]をクリックしてください。
[Test Page Cache]をクリックすると、ページキャッシュのテスト結果が表示されます。
おすすめの[ディスク: 拡張]を選択して[NEXT]をクリックします。
サーバーの種類や構成によって、選択できるオプションに違いがあります。
ほとんどの場合は[ディスク: 拡張]で大丈夫です。
ページキャッシュとは、動的ページをあらかじめ静的に生成しておく機能です。
ブラウザ側ではなく、サーバー側の速度が高速化されます。
PageSpeed Insightsの「最初のサーバー応答時間を速くしてください(Reduce initial server response time)」を改善できます。
セットアップガイドは何回でも実施できますし、設定も後から変更できます。
[データベースキャッシュをテスト]をクリックすると、データベースキャッシュのテスト結果が表示されます。
[なし]のまま[NEXT]をクリックします。
データベースキャッシュは不具合が出やすいです。
レンタルサーバーなどでは通常OFFで大丈夫です。
データベースキャッシュとは、読み取りに時間のかかるデータベースの情報を一時的に保管しておく機能です。
「データベースに保管するからデータベースキャッシュ」は誤りです。
ディスクよりもメモリにキャッシュしたほうが読み取り速度が速く、効果的です。
[Test Object Cache]をクリックすると、オブジェクトキャッシュのテスト結果が表示されます。
[なし]のまま[NEXT]をクリックします。
オブジェクトキャッシュは不具合が出やすいです。
レンタルサーバーなどでは通常OFFで大丈夫です。
オブジェクトキャッシュとは、読み取りに時間のかかるデータベースの情報をメモリに一時的に保管しておく機能です。
データベースキャッシュと似ていますが、オブジェクトキャッシュはWordPress特有の機能です。
[Test Browser Cache]をクリックすると、ブラウザキャッシュのテスト結果が表示されます。
[有効]のまま[NEXT]をクリックします。
ブラウザキャッシュはレンタルサーバーによっては自動的に設定されている場合もあります。
ただ、基本的にはONで大丈夫です。
ブラウザキャッシュとは、一度アクセスしたサイトの静的ファイルをブラウザに保管しておく機能です。
サーバー側ではなく、ブラウザ側のダウンロード量が減るため高速化されます。
ブラウザキャッシュを有効にすると、ブラウザを普通に更新(F5)しても変更が反映されません。
そのため、ブラウザをスーパーリロード(キャッシュクリア)する方法を覚えておきましょう。
[画像の遅延読み込み]はOFFのまま[NEXT]をクリックします。
SWELL
画像圧縮・WebP化プラグイン「EWWW Image Optimizer」などにも同様の機能があります。
機能が重複するため、ほとんどの場合、画像の遅延読み込み機能の設定は不要です。
「W3 Total Cache」でWebP化するには拡張機能「Image Service」を導入する必要があります。
さらに、上限に達すると課金が必要な有料プランに誘導されます。
無料でWebP化したい場合は、「EWWW Image Optimizer」などのプラグインを利用してください。
すべてのテストが完了したら、[DASHBOARD]をクリックします。
以上で、「W3 Total Cache」の標準的な設定は完了です。
以降は、各機能の詳細設定を見ていきます。
左メニューの[ページキャッシュ]をクリックします。
一般は、特に変更の必要はありません。
重要度 | 設定項目 | 説明 |
---|---|---|
低 | フロントページをキャッシュ | トップページをキャッシュするか |
低 | フィードのキャッシュ | feedページをキャッシュするか |
低 | Cache SSL (HTTPS) requests | SSLをキャッシュするか |
低 | クエリ文字列変数を使って URI でキャッシュを実行 | サイト内検索などをキャッシュするか |
低 | 404 (not found) ページのキャッシュ | 404ページをキャッシュするか |
中 | ログイン済みユーザーに対してページをキャッシュしない | 会員サイトやECサイトはON 通常もON |
低 | 以下のユーザー権限グループに対してページをキャッシュしない | ユーザー権限ごとの設定 |
[404 (not found) ページのキャッシュ]をONにすると、一時的なアクセス不可の際にページが404としてキャッシュされてしまう恐れがあります。
[ログイン済みユーザー]もキャッシュしてしまうと、別のユーザーに他のユーザーの情報が表示される恐れがあります。
会員サイトやECサイトでは、必ずキャッシュしない設定にしてください。
通常のブログ利用でも、管理者がログインしている状態だと編集結果を確認できなくなります。
キャッシュプリロードは、[ページキャッシュを自動に事前準備する]をONに変更して、[サイトマップ URL]を入力します。
[Save Settings & Purge Caches]をクリックして保存します。
キャッシュプリロードは、キャッシュを事前に準備する機能です。
これをOFFにすると、最初のユーザーが訪問するまでキャッシュが生成されないため、表示速度が遅くなります。
[Preload the post cache upon publish events]をONにすると、記事を公開してすぐにキャッシュされるようになります。
そうすると、ミスに気づいてすぐに修正しても、キャッシュが残っているため反映されるのが遅くなります。
XMLサイトマップの作成がまだの場合は、以下をご覧ください。
圧縮は不具合が起こりやすいため、デフォルトでOFFになっています。
特に「W3 Total Cache」のCSS・JavaScript・HTMLの縮小化・結合は、不具合が起こりやすいです。
CSS・JavaScript・HTMLなどのファイル縮小化・結合をしたいなら「Autoptimize」がおすすめです。
データベースキャッシュは不具合が起こりやすいです。
ここでは説明を割愛します。
AWS ElastiCacheでMemcachedを利用したい場合は、以下をご覧ください。
データベースキャッシュは不具合が起こりやすいです。
ここでは説明を割愛します。
ちなみに、設定方法はデータベースキャッシュとほぼ同じです。
左メニューの[ブラウザーキャッシュ]をクリックします。
一般やコンテンツごとの設定は、特に変更の必要はありません。
重要度 | 設定項目 | 説明 |
---|---|---|
低 | Last-Modified ヘッダーを設定 | コンテンツの最終更新日を出力 |
低 | Expires ヘッダーを設定 | コンテンツの有効期限を出力 |
中 | キャッシュ制御ヘッダーを設定 | コンテンツのキャッシュ情報を出力 |
低 | エンティティタグ (ETag) を設定 | コンテンツのバージョン識別子を出力 |
低 | W3 Total Cache ヘッダーを設定 | コンテンツの最適化を出力 |
中 | Enable HTTP (gzip) compression | gzip圧縮を有効にする |
低 | Enable HTTP (brotli) compression | brotli圧縮を有効にする |
低 | 設定変更後のオブジェクトのキャッシュを防止 | クエリ文字列でキャッシュを防止 |
低 | Remove query strings from static resources | 静的リソースからクエリ文字列を削除 |
左メニューの[キャッシュグループ]をクリックします。
キャッシュグループは、使用するテーマによって変わります。
SWELL
CDNは、高アクセスWebサイトの場合に高速化できます。
AWS CloudFrontやS3、StackPathなどが利用可能です。
上級者向けの機能ですので、ここでは説明を割愛します。
AWS S3に画像などの静的ファイルをオフロードしたい場合は、以下をご覧ください。
フラグメントキャッシュは、ページの一部のみをキャッシュする機能です。
有料のPro版向けの機能ですので、ここでは説明を割愛します。
左メニューの[一般設定]をクリックします。
User Experience設定の[絵文字の無効化]をONに変更して保存します。
重要度 | 設定項目 | 説明 |
---|---|---|
低 | 画像の遅延読み込み | ほとんどの場合OFFのまま |
高 | 絵文字の無効化 | 読み込みを減らすためON |
低 | Disable wp-embed script | リンクの埋め込みを無効化 |
低 | Disable jquery-migrate on the front-end | jquery-migrateを無効化 |
SWELL
画像圧縮・WebP化プラグイン「EWWW Image Optimizer」などにも同様の機能があります。
機能が重複するため、ほとんどの場合、画像の遅延読み込み機能の設定は不要です。
WordPressには、初めからアイコンフォント(絵文字)が準備されています。
ほとんどの場合使用しないため、読み込みを減らすために[絵文字の無効化]をします。
カスタマイズを行なった場合や不具合が発生した場合は、一度キャッシュをクリア(パージ)することをおすすめします。
アドミンバーから[Purge All Caches](すべてのキャッシュをパージ)します。
「W3 Total Cache」は、Google PageSpeed Insights(PSI)と連携する機能があります。
左メニューの[一般設定]をクリックします。
Google PageSpeedの[Authorize]をクリックします。
利用するGoogleアカウントを選択します。
左メニューの[Google PageSpeed]をクリックします。
解析が始まり、しばらく待つとPSIスコアが表示されます。
まず最初に、キャッシュをクリアしてみてください。
設定変更などを行なった場合も、毎回キャッシュをクリアしたほうがいいです。
左メニューの[ページキャッシュ]をクリックします。
[互換モード](Compatibility mode)をONにして保存します。
左メニューの[一般設定]からそれぞれ無効化してください。
「Contact Form 7」「MW WP Form」「Contact Form by WPForms」などのお問い合わせフォームで不具合が出た場合は、そのページを除外設定してください。
例えば、「contact」というページなら、以下のように設定します。
左メニューの[パフォーマンス]→[ページキャッシュ]から[以下のページはキャッシュしない]に「contact」を設定して保存します。
この他にも、「確認(confirm)」ページや「サンクス(thanks)」ページもあれば除外設定してください。
プラグイン「W3 Total Cache」のおすすめの設定方法と使い方を見てきました。
念のためデザイン崩れやコンタクトフォームなどの動作確認をおすすめします。
表示速度の変化を確認したい場合は、再度「PageSpeed Insights」で計測してみましょう。
ただし、計測値と体感のスピードは違いますので、実際の挙動確認もお忘れなく。
ページ表示が速くなりました。
よい結果が出たら、ぜひ教えてください。
ページキャッシュ機能を提供するキャッシュプラグインを導入していないからです。
以下のようなキャッシュプラグインを導入してください。
「W3 Total Cache」でオブジェクトキャッシュを有効化することで警告は消えます。
ただし、オブジェクトキャッシュは不具合が多い機能です。
よくわからない場合はオブジェクトキャッシュを有効化しないことをおすすめします。
コメント