WordPressを始めたばかりの頃、「is_mobile関数」という独自コードをネットから拾ってきて使っていました。
最近ではwp_is_mobileというWordPresの関数を使ってましたが、このコードだとうまくコントロールができなかったので、昔使っていたis_mobileの仕様と同じ感じに調整することにしました。
スマホとそれ以外という条件分岐がしたい
wp_is_mobileは、パソコンとモバイル端末を区別したいときに使う関数です。
この関数を使うことで、パソコンでの表示とモバイル端末での表示を切り分けることができて便利なんですが、画面が大きいタブレットもスマホと同じ扱いになってしまうのが欠点です。
持ち運びができる端末かどうかというよりは、ディスプレイサイズで切り分けたいことが多いんですよね。
もちろんそんな時はCSSのメディアクエリを使って、ディスプレイサイズに応じてCSSを調整すればほとんどの場合は解決できます。
その「ほとんどの場合」を超えてきてしまう稀なケースに出会ってしまって、どうしてもPHPで制御したかったため、コードを調整することにしました。
is_mobile関数のダメなところ
is_mobile関数のだめなところは、UAで切り分ける仕様であることで、メンテナンス性が悪すぎる点です。
以前に使っていたコードを見てみたら、BlackBerryとかWindows Mobileなどの記述がありました。現在の端末のUAとか全然わかりませんし、そもそもどんな端末が販売されているのかも把握できてません。
このコードを使い続けるとなると、市場を常に把握しておかないといけなくなってしまって現実的ではないので、基本的にはCSSのメディアクエリで調整し、どうしてもPHPで切り分けたい場合には公式のwp_is_mobile関数を使うのが良いという結論に至りました。
wp_is_mobile関数でタブレットをPC判定にする方法
前置きが長くなりましたが、wp_is_mobile関数を使って、タブレットをスマホではなくパソコンの判定にするコードが下記の通りです。
function is_smartphone() {
// まず WP 標準でモバイル判定
if ( ! wp_is_mobile() ) {
return false;
}
$ua = isset( $_SERVER['HTTP_USER_AGENT'] ) ? $_SERVER['HTTP_USER_AGENT'] : '';
// iPad を PC 扱い（スマホではない）
if ( strpos( $ua, 'iPad' ) !== false ) {
return false;
}
// Android タブレットを PC 扱い（Mobile トークンがなければタブレット）
if ( strpos( $ua, 'Android' ) !== false
&& strpos( $ua, 'Mobile' ) === false ) {
return false;
}
// 上記以外はスマホとみなす
return true;
}
このコードはChatGPTに書いてもらったので、自分で組み込んでチェックをしましたが、問題なく使うことができました。
皆さんもこのコードをコピペするのは全然問題ないですが、ご自身でChatGPTなどのLLMを使って作ることもできますので、そちらもぜひお試しください。
最後に
本当に稀なケースでどうしてもメディアクエリだけで対応できず、今回のコードで切り抜けました。
ChatGPTのおかげでこういう稀なケースに対してもすぐに対応できるようになったのは嬉しいところです。
ただコードを書いてもらうのではなく、相談もできますし、なぜこのコードを実装するのが良いかの根拠も添えてくれていたため安心して使えました。