ウェブマスターがウェブのことを書いたら

ウェブマスターとして働いている管理人がウェブで躓いたこと、ググったことを備忘録として書いています。主に技術的なこと、WEBサイト設計のこと

WP super cacheではPCとスマホの2つのページをキャッシュできない

   

 - WordPress, ページ高速化

WP super cacheのページキャッシュについての注意点をまとめておきます。

ページをキャッシュして高速化するためのプラグイン、WP super cacheではキャッシュを1つしか作れないので、PCとスマホで2ソースで作成したサイトの場合、1つのページしかキャッシュできませんでした。

これはページキャッシュツールの殆どがその仕様のようで、レスポンシブデザインの場合は問題ありませんが、PC・スマホで別ソースで作成していると最初に見られたページの方をキャッシュされてしまうので、スマホで見た場合、PCのページが表示されていたり、PCで見た場合、スマホのページが表示されたりする状態になってしまいます。

PC・スマホ別にキャッシュするには?

WP super cacheでは仕様がそうなっているため、解決方法はプラグインを変更するしかありませんでした。PCとスマホ別でキャッシュできるプラグインは、「W3 Total Cache」です。

こちらのプラグインに変更すると問題なく別ページでキャッシュされました。ページ高速化に関しても多機能なプラグインです。多くのサイトでも設定方法が紹介されているプラグインですので、私が設定した内容だけ記載しておきます。詳細な説明は省きます。

詳しくはこちらのサイトが分かりやすく書かれています。(ありがとうございます。)
PCとスマホを分けて綺麗に高速表示してくれるWPキャッシュプラグイン「W3 Total Cache」の簡単設定方法

インストールするとき見つからない場合

プラグインの新規追加で検索しても出てこない場合は以下の公式ページからzipファイルをダウンロードして、新規追加画面のzipファイルからアップロードでインストールできます。私の環境では検索しても出てこなかったのでこうしました。

公式のプラグインページはこちらです。
W3 Total Cache — WordPress プラグイン

インストールしてエラーが出た場合

プラグインをインストールした際に、W3 Total Cacheの設定画面を開くとエラーの項目がでている場合があります。私の環境ではエラーがでていました。

対処方法はこちらのサイトが分かりやすく書かれています。(ありがとうございます。)
W3 Total Cache でエラーが出た時の対処法

W3 Total Cacheの設定内容

私が設定した内容だけ記載します。
左メニューに「Performance」という項目が追加されていますので、その中の「General Settings」という項目と「User Agent Groups」という項目を設定します。

General Settingsの設定画面

General Settingsでは「Page Cache」の項目で「Enable」にチェックを入れました。バージョンによって設定内容が変わると思います。

WP super cacheの設定

User Agent Groupsの設定画面

User Agent Groupsでは「Enabled:」の項目2か所(highとlow)にチェックを入れました。
User-Agent Groupsの設定

以上です。上記の設定でPC、スマホを別にページキャッシュができました。

「この記事が参考になった」場合はクリックをお願いします。