今回は、Wordpressプラグインの中で高速化に特化した最強プラグインをご紹介します。
それがこの「WP Rocket」です。
海外でも軒並み非常に高い評価を受けており、ずっと注目されているプラグインです。
これ一つで、高速化における様々な機能が付属され処理できる有能プラグイン。
そんな「WP Rocket」ですが、「海外のプラグイン」・「有料プラグイン」であるために日本ではほとんど紹介されることもなく使用している方も少ないかと思います。
ただ、そのバードルがクリアできるなら使ってみたくないですか?この記事を読んで使用していただいた方がモバイルページの表示速度が倍増したりしてます。
ロキさんに紹介してもらったWP Rocketプラグインを導入した結果、モバイルでのページスピードが向上しました?
以前は30台だったので、倍増です?設定次第でもっと上がると思うので、おすすめですよ~☺️ https://t.co/QZrmHqEbBm pic.twitter.com/wt69HUgjSe
— はげにゃん☆ (@hagenyanstar) July 19, 2020
ここではそのハードルをクリア出来るように必要な情報を解説していきます。
WP Rocketのメリット・デメリット
最初にWP Rocketのメリット・デメリットを紹介します。
このプラグインのメリット・デメリットは非常にシンプルです。そしてメリットの価値が高い!
まずはデメリットからお伝えします。
WP Rocketのデメリット
このプラグインは様々な機能を備えているため、重複するプラグイン機能を停止させてください。
WP Rocketで設定可能な項目は、様々なプラグインとしてインストールされていると思います。
例えばCACHE(キャッシュ)系プラグイン・LazyLord系プラグインなど。
それぞれの機能が重複してしまうと、本来の力を発揮できない可能性があります。
その見極めをしっかりと行い、不必要なプラグインを停止・削除しましょう。
ただ、これは不要なプラグインが無くなり動作が軽くなるのでメリットにも繋がりますよ!
また、「有料」であることがデメリットとお伝えする記事もあるかもしれません。
私は個人的に使用してますが、十分な価値があると判断するためこの価格にデメリットは感じません。価格分の価値は十分にありますよ!
WP Rocketのメリット
これはもちろんWordpressページの高速化です!!!
これが現在の私のWordpressページの表示速度です。
この表示速度のすべての要因がWP Rocketで達成した!と言い切ることはしません。が、実際に使用してみて体感として一番実感できたプラグインとなります。
こちらが現在私が使用しているプラグイン一覧です。この中でWordpressページの表示速度に関わるものはこのWP Rocketともう一つこちらで解説している画像圧縮CDNプラグイン「ShortPixel Adaptive Images」のみです。
画像以外のすべての点においてこのWP Rocketが担ってくれているんです。
さらに、様々なプラグインの機能をこのWP Rocketが担ってくれることでプラグインの数を減らせるメリットも大きいですよね!
このプラグインリストもかなりシンプルになっているのではないかと思います。
プラグインって結構重たい動作のモノも多いんですよ、気が付いていないだけで!!!
WP Rocketの設定方法
ここからは、実際に私が設定している内容を紹介しながらWP Rocketの設定方法を解説します。
まず、この設定ですがあくまでも私のサイトでの設定でありこうすれば全てに当てはまる訳ではございません。何か不具合などが起きないようにバックアップを取るなど慎重に行いましょう!
設定はもちろんすべて英語の項目となります。分からない部分は翻訳するなどついでに英語の勉強もしてしまうと一石二鳥かもしれませんね!?
それでは、設定解説に入ります。
設定をチェックしたり開設する必要がある項目には、私の設定画像を入れて解説しています。
項目で一切チェックしていない項目などは、写真なしで簡潔に解決してます。
それぞれの設定を行ったらちゃんとSAVEしてくださいね!
Cache(キャッシュ)の設定
ここでは、Cashe(キャッシュ)の設定を行います。
「Enable caching for mobile devices」にチェックを入れます。(初期設定でONな気がします)
これは、モバイルサイトでcacheを有効化するかどうかですが、有効化するためチェックします。
また、「Separate cache files foe mobile devices」ですがファイルをモバイルと分けると速くなるサーバーもあるそうですが、最近はレスポンシブデザインであるテーマも多いのでチェックは不要かと思っています。
その他は、「ログインページのキャッシュについて」や「キャッシュのLifespan」についてなのでデフォルトの状態でよいかと思います。
もし、Wordpressページでログインなどの設定がある方はチェックしてくださいね。
File Optimizationの設定
ここではFile Optimization(ファイルの効率化設定)の設定を行います。
設定項目が沢山あるので、各項目ごとに写真を付けて解説します!
まず、Basic Settingの解説です。
「Minify HTML」はHTMLを圧縮し小さくしてくれるのでチェック。
「Optimize Google Fonts」はFontsのファイルをまとめてくれるのでチェック。
この項目はCSS Files設定の項目です。
「Minify CSS Files」はCSSファイルをまとめてくれるのでチェック。
ただし、ファイル崩れを起こす場合もあるので挙動を確認しつつチェックを入れる。
「Combine CSS files 」はCSSファイルを結合してリクエストを減らしてくれるのでチェック。
また、次世代型のサーバーだと結合しない場合のほうが速い場合もあるので要確認!ただ、私は次世代サーバーらしいのですが、チェックすると速度が上がったのでチェックしてます。
「Optimize CSS Files」はCSSのrender-blockingを防いでくれるのでチェック。
空白の枠の中は、結合したくないCSSファイルなどの設定になるので何もなければ記入無し。
ここからは、Java Script Filesの設定です。
「Remove jQuery Migrate」はjQuery MIgrateファイルを削除するとJSファイルが削除され読み込み時間が速くなるのでチェック
「Minify JavaScript files」はCSSの時と同様にJSファイルをまとめてくれるのでチェック。
ただし、ここもCSSと同様にファイル崩れを確認してください。
「Combine JavaScript files」はJSファイルを結合してリクエストを減らせるのでチェック。
これもCSS設定と同様に次世代サーバーかどうか要確認してチェックしてください。こちらも同様に私は次世代サーバーでもチェックしたら速度が上がったのでチェックしてます。
「Load JavaScript deferred」はJSファイルのrender-blockingを防いでくれるのでチェック。
そして、「Load JavaScript deferred」をチェックすると出てくる「Safe Mode for jQuery (recommended)」も合わせてチェック!
Mediaの設定
ここではMedia(画像)の設定を行います。
まず最初に、「LazyLord・画像遅延読み込み」の設定ですが私は別のプラグインで設定しているのでチェックをしていません。もし、お使いの画像プラグインなどで設定できない場合はチェックを入れてください。
「Disable Emoji」は絵文字を無効化するかどうかです。絵文字使わないならチェック。
これでHTTPリクエストが減らせます。
「Disable WordPress embeds」はWordpress機能である埋め込みの無効化。記事でカードやツイッターの埋め込みなどを使用しない場合はチェック。私は使用するのでチェックしてません。
「Enable WebP caching」はWP RocketとWebPで互換性のあるプラグインを使用している場合はチェック。私は使用していないのでチェックしてません。
(WebP対応はShortPixel Adaptive Imagesで対応してます。解説記事はこちらをチェック!)
Preloadの設定
ここではPreload設定を行います。
「Activate Preloading」はWP Rocketのキャッシュプリロードを有効にするかどうかでチェック
「Activate sitemap-based cache preloading」はサイトマップベースでキャッシュプリロードを有効にするかどうか。WP Rocketが対応しているSEO系プラグインであればチェックボックスがでます。それ以外でチェックしたい方はサイトマップURLを記載してください。
これ以外の「Prefetch DNS Requests」や「Preload Fonts」特に何も記載なしです。
Advanced Rulesの設定
ここではAdvanced Rulesの設定を行います。
基本私はこの設定部分は全て空欄にしています。
「Never Cache URL」でキャッシュさせないURLを指定したり、「Never Cache Cookies」でCookieを除外したいページがあったりする場合はその項目に記載してください。
さらに「Always Purge URL」は投稿・ページを更新するたびにその都度キャッシュから削除したいURLがある場合。「Cache Query String」は初期状態でクリエ文字列をキャッシュしないWP Rocketの仕様を変更する場合に使用してください。
Datebaseの設定
ここでは、Datebaseの設定を行っていきます。
「Revisions」は、投稿のリビジョンを削除する設定。投稿も貯まると重くなるので削除したいところですが、以前作成した記事を確認したい場合などあるのでチェックしていません。気にならない方はチェックしてください。
「Auto Drafts」は下書きを削除する設定。これは自動で下書きが消えしまうので、チェックはしないほうが良いと思います。下書きにしない人はチェック。
「Trashed Posts」は削除済み項目から投稿を削除する設定。間違って削除してしまったり、削除したけど元に戻したいことがあったりする場合はチェックしない。必要ない人はチェック。
「Spam Comments」はスパムコメントを削除する設定。スパムコメントはいらないのでチェック入れてますが、通常コメントとスパムコメントが混同してしまうのであれば考えてください。
「Trashed Comments」はゴミ箱に入れたコメントを削除する設定。これはチェックしてます。
「Expired transients」は期限切れのtransientsを削除する設定。transientsはWordpressが発行する一時的なデータベース保存に必要なAPIの事。チェック無しでやってます。
「All transients」は先ほどのtransientsを全て削除する設定。この辺りは消す必要があるか分からないのでチェックしてません。
「Optimize Tables」はテーブルを最適化する設定。いまいち何をしているのか分かりませんがとりあえずチェックしてます(チェックする前と後で動作確認してくださいね)
「Schedule Automatic Cleanup」は上記の設定でチェックを入れた削除項目をどの期間で行うかを決める設定。個人的にはDaily(毎日)行う設定にしてます。
CDN・Heartbeat・Add-ons・Image Optimization・Toolsの設定
これらの項目は人によって必要かどうかが変わるので、簡潔にお伝えします。
「CDN」設定は、WP Rocketが提携しているCDNサービスを有効にするかどうか、またその詳細設定を行う項目です。互換性のあるCDNサービスを使用している方は確認してください。
互換性のあるCDNサービスなどはこちらの公式サイトで確認してください。
「Heartbeat」設定は、WordpressにあるHeartbeat APIの設定をする項目。記事を自動保存したり様々な時に使用されるAPIですが、サーバー側で高負荷になるときがあります。
制限するとサーバーリソースの節約になるのですが、テーマやプラグインに影響を及ぼすこともある設定項目です。
「Add-ons」設定は、「Google Tracking」・「Facebook Pixel」などのJSプラウザキャッシュを改善する機能があるため必要であれば設定してください。
ただし、【Googleタグマネージャーを使用してアナリティクスを使用している場合】や【PixelYourSite等一部のプラグインを使ってFacebookピクセルを設定している場合】は対象外となるので注意。
「Varnish」はサーバーが「Varnish」を導入しているのであればチェックしてください。
それ以降も、使用しているのであればチェックしてくださいね。
「Image Optimization」設定は、WP Rocketと開発元が同じである「Imagify」というプラグインの設定項目になります。このプラグインを使用してるなら確認してください。
「Tooles」設定は、WP Rocketの設定ファイルをインポート・エクスポートできる設定や「Rollback」ができる項目があります。確認し必要なら行ってください。
WP Rocket設定後に行う項目
ここまででWP Rocketの設定は以上になります。
設定完了後、ダッシュボードに戻りキャッシュなどの削除を行います。
右下の赤枠内を確認してください。
「Remove all cached files」は全てのキャッシュを削除するボタン
「Start cache preloading」はキャッシュのプリロードを開始するボタン
「Purge OPCache content」はOPCacheコンテンツを除去をするボタン
「Regenerate Critical CSS」はCSSファイルを再構築するボタン
の4つがあります。
これを上から順に押していきましょう。
その後、設定したページに不具合がないかをチェックしあれば設定項目を確認して対応します。
ここまで、解説してきましたが設定できる項目が細かく専門的、さらに英語とかなり大変でしたよね。それぞれのサイトによって設定項目を変える必要もあるかと思うので一つ一つクリアにしながら設定していきましょう!!!
設定が終えて、何も不具合がなければPageSpeed InsightやGTmetrixなどで計測してみましょう。
きっと満足いく結果になっていると思いますよ!
WP Rocketの購入・ダウンロード方法
ここからは、WP Rocketの購入・ダウンロードの方法を解説していきます!
まずはこちらのWP Rocketの公式サイトへ行きましょう。
このトップページが現れると思います。そこで右上の「BUY IT NOW」をクリック。
クリック後、上記の価格説明画面になります。
どのプランもサポート期間は1年で使用できるサイト数に制限があります。
「SINGLEプラン」は$49で1サイト
「PLUSプラン」は$99で3サイト
「INFINITEプラン」は$249でサイト数無制限
というプラン設定です。
プランを決めたらそれぞれプランの下にある「BUY WP ROCKET」をクリック。
クリック後、上記の情報登録画面になります。
それぞれ対応する項目を記入してください。支払いは各種クレジットカードかPayPalです。
因みに海外のテーマやプラグインを購入する場合はかなりの頻度でPayPalが使用できます。
セキュリティの面も有利だと思うのでアカウント作成すると便利です!
購入が完了すると、購入完了画面にダウンロードボタンが出てきます。
クリックして、WP Rocketをダウンロードしてください。
もしこの画面を閉じでしまった場合などは登録したメールアドレスにメールが届いていますのでそちらから「My Account」にログインできる情報があるのでそちらからログインしていただければ下記画像のように「LICENSE」項目にダウンロードボタンがあります。
その後はWordpressでプラグイン新規追加よりWP Rocketを追加してください。
WP ROCKETの設定と使い方を解説 まとめ
ここまで、長い設定お疲れ様でした。
今の時代、SEO対策などでもWEBページの表示速度は「速さ=正義」です。
「速さ」を手に入れるために、WP Rocketはこれだけ大変な設定をしてでも手に入れる必要があるのです!
このWP Rocketという「速さ」への強力なプラグインと共に、快適なサイト運営をしましょう!
コメント
[…] この「WP Rocket」を詳しく解説している記事はこちらです。 […]
[…] WP Rocket(詳しい解説はこちら) […]