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度クリアします。

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




思考したり情報整理したい時はMarkdown記法で文章を書き出そう!!Webデザイナーの情報整理術
CSSだけで画像の比率を保ってトリミングできる「object-fit」
無料版を使っている人は検討する価値あり!MAMP PRO 5で簡単にローカル開発環境を構築・管理する
WordPressで「現在メンテナンス中のため、しばらくの間ご利用いただけません。」の状態でログインできなくなった場合の対処法
ウェブサイトをダークモードに対応するときに気をつけること
Vue.jsで値段を表示するときに3桁ごとにカンマを入れる方法
iTerm2を使いこなすために覚えておきたいショートカット集
Visual Studio Codeで英単語のスペルチェックをしてくれる拡張機能「Code Spell Checker」
Visual Studio Codeの文字サイズやタブサイズの設定方法
アイコンフォントをPCにインストールしている場合は、コーディング後の確認に注意
AirPodsで片耳を外しても再生が止まらないようにする方法
MacのKeynoteにハイライトされた状態でコードを貼り付ける方法
iTerm2でマウスやトラックパッドの操作を設定できる環境設定の「Pointer」タブ
DeepLで「インターネット接続に問題があります」と表示されて翻訳できないときに確認すること
Ulyssesの「第2のエディタ」表示を使って2つのシートを横並びに表示する
【2026年版】Karabiner-Elementsで実現する右commandキー活用のススメ
Bartender ProのTop Shelf機能でできること
高機能なスクリーンショットアプリ「CleanShot X」
macOSの効率化に関するDiscordコミュニティ「CMD-F」を立ち上げました
1Passwordの開発者向け機能(SSH Agent / Environments / 1Password CLI / Developer Watchtower)
Default Folder Xで保存ダイアログ内のファイルリストにフォーカスする方法
Obsidianで整理した知識をAnkiで定着させる方法
Figma × Keyboard Maestroでどこまで効率化できる?
マウス操作の完成度が高いウインドウリサイズアプリ「Magnet」
Macで複数ディスプレイを使っている場合に便利な設定集