スマートフォンかタブレット&デスクトップという分け方をする場合、ワードプレスの組み込み関数wp_is_mobile()では対応できません。wp_is_mobile()ではiPadやKindleなどのタブレットもモバイル端末として認識してしまうからです。スマートフォンだけを判別するユーザー定義関数を作ってみます。
2019年3月27日
まずはGoogle Chromeのデベロッパーツールを使用して主な端末のユーザーエージェントを調べてみます。
---------------------
スマートフォン
---------------------
iPhone 6/7/8 375*667
mozilla/5.0 (iphone; cpu iphone os 11_0 like mac os x) applewebkit/604.1.38 (khtml, like gecko) version/11.0 mobile/15a372 safari/604.1
Galaxy S5 360*640
mozilla/5.0 (linux; android 5.0; sm-g900p build/lrx21t) applewebkit/537.36 (khtml, like gecko) chrome/73.0.3683.86 mobile safari/537.36
BlackBerry Z30 360*640
mozilla/5.0 (bb10; touch) applewebkit/537.10+ (khtml, like gecko) version/10.0.9.2372 mobile safari/537.10+
LG Optimus L70 384*640
mozilla/5.0 (linux; u; android 4.4.2; en-us; lgms323 build/kot49i.ms32310c) applewebkit/537.36 (khtml, like gecko) version/4.0 chrome/73.0.3683.86 mobile safari/537.36
---------------------
タブレット
---------------------
Kindle Fire HDX 800*1280
mozilla/5.0 (linux; u; en-us; kfapwi build/jdq39) applewebkit/535.19 (khtml, like gecko) silk/3.13 safari/535.19 silk-accelerated=true
Nexus 10 800*1280
mozilla/5.0 (linux; android 6.0.1; nexus 10 build/mob31t) applewebkit/537.36 (khtml, like gecko) chrome/73.0.3683.86 safari/537.36
iPad 768*1024
mozilla/5.0 (ipad; cpu os 11_0 like mac os x) applewebkit/604.1.34 (khtml, like gecko) version/11.0 mobile/15a5341f safari/604.1
BlackBerry PlayBook 600*1024
mozilla/5.0 (playbook; u; rim tablet os 2.1.0; en-us) applewebkit/536.2+ (khtml like gecko) version/7.2.1.0 safari/536.2+
ユーザーエージェントを見ますといくつかのことがわかります。
●「iphone」がある => iPhone
●「android」がある => Androidのスマートフォンまたはタブレット
●「mobile」がある => スマートフォンまたはiPad
●「ipad」がある => iPad
単純に「android」があればAndroidのスマートフォンとはならないようです(Nexus10はandroidはあるがタブレット)。一つひとつ機種を特定する文字列を探していくやり方はたいへんそうなので、以下のような判定ルールとしてみたいと思います。
「mobile」がある。かつ「ipad」がない => スマートフォン
「mobile」があればスマートフォンかiPadということになりますから、そこからiPadを除外してあげればスマートフォンだけということになります。
判定ルールができましたのでスクリプトを書いてみます。stripos() は特定の文字列のなかに求める文字列があるかどうかを調べてくれる関数です。ユーザーエージェントを見ると小文字しか使われていませんが念のため大文字小文字を区別するstrpos()ではなく区別しないstripos()を使ってみたいと思います。
求める文字列があればその現れる位置を数字で返してくれ(先頭にあった場合は0が返ってくる)、無かった場合はfalseが返ってきますので以下のような記述になります。返り値を真偽値(trueまたはfalse)としておくことで、is_mobile()による判定ではスマートフォンであればtrue、スマートフォンでなければfalseが返るという関数になります。
・PHP: stripos – Manual
function is_mobile() {
if (isset($_SERVER['HTTP_USER_AGENT'])) {
$m = stripos($_SERVER["HTTP_USER_AGENT"], 'mobile');
$i = stripos($_SERVER["HTTP_USER_AGENT"], 'ipad');
if (($m !== false) && ($i === false)) {
return true;
} else {
return false;
}
}
}
実際にワードプレスのなかでis_mobile()を使う場面はいろいろあるかと思います。JavaScriptの読み込みをスマートフォンとタブレット・デスクトップで分けたいこともあるでしょう(例えばAdSenseなど)。あるいはタブレットにデスクトップ版を表示する場合、以下のmetaタグがあると画面からはみ出しますので、この記述はスマートフォンだけで使用するようにした方がいいので、こうした場面でもis_mobile()があると便利です。
■header.php
<?php if(is_mobile()) {
echo '<meta name="viewport" content="width=device-width,initial-scale=1.0">';
}
?>
以上で「PHPでスマートフォンかどうかを判別(is_mobile()の作成)」の解説を終わります。