WordPressのwp_is_mobile()で条件分岐をするときは、キャッシュの設定に注意

WordPressにはwp_is_mobile()という条件分岐タグがあって、これを使うことでデバイスごとに表示の出し分けが可能です。

wp_is_mobile()でスマホからのアクセスを判断

wp_is_mobile()という条件分岐タグを使うと、スマホからアクセスしているときにtrue、それ以外の場合はfalseが返ってきます。

具体的な使い方はPHPのif文で下記のように書くことで、スマホとPCで表示するコードを出し分けられます。

<?php if( wp_is_mobile() ): ?>
// スマホで表示するコード
<?php else: ?>
// PCで表示するコード
<?php endif; ?>

使用するときの注意点としては、「画面サイズではなくあくまでデバイスでの分岐がされる」ことが挙げられます。

例えばPCのブラウザサイズを小さくしてスマホサイズにしても、条件分岐としては「PCから見ている」という判定になるため、PCで表示するコードが表示されます。

スマホでキャッシュを使うと分岐がうまくできない場合がある

ここからが本題ですが、プラグインの設定などでスマホでもキャッシュを有効にしていると、このwp_is_mobile()による条件分岐がうまく動作しないときがあります。

そもそもプラグインなどで設定するキャッシュは、毎回アクセスするたびにPHPで処理をしていると時間がかかってしまうので、すでに処理したデータを残しておいて、それが見つかればデータを優先して返すというものです。

そのため、wp_is_mobile()を使ったPHPによる条件分岐が使われず、スマホで見たときもサーバーに残っているPC用のコードが返ってきてしまう恐れがあります。

スマホではキャッシュを使わないようにする

ちゃんとPHPによる条件分岐が動くようにするためには、スマホではキャッシュを使わないようにする必要があります。

例えば、WordPressのキャッシュ系プラグインで有名な「WP Fasetest Cache」を使っている場合は、設定画面に「モバイルユーザーに対してキャッシュを表示しない」という項目があるのでそこにチェックを入れて、キャッシュを1度クリアします。

これでスマホを見れば、ちゃんと条件分岐されて表示されているはずです。