web制作の隙間問題

ウェブ制作で気づいたこととかを殴り書き。中の人は、デザイン、コーディング、ちょっとプログラミング、企画・設計・運用・SEO屋さん。

is_mobile()を便利にするプラグイン「mobble」で楽々デバイス判定

WordPressのis_mobile()便利。だけど…

WordPressの関数、is_mobile() 便利ですよねー。
スマホタブレットとPCを条件分岐してくれるアレです。

でもサイトによっちゃ、スマホタブレット・PCで分岐したかったりしますよね〜。
で、is_mobile()をfunctions.phpで再定義し直したり…

というのも面倒なので笑、プラグインで解決しようということでディグったらありました!

その名もmobble。モブル。かわいい。

ja.wordpress.org

is_mobileを使いたい人が欲しがるような便利機能付き!

さすがプラグイン化しているだけあって、単にis_mobile()を再定義しているだけじゃ無いんです。

プラグインのサイト見てもらえばすぐわかることではあるんですが一応紹介。

<?php
is_handheld(); // any handheld device (phone, tablet, Nintendo)
is_mobile(); // any type of mobile phone (iPhone, Android, etc)
is_tablet(); // any tablet device
is_ios(); // any Apple device (iPhone, iPad, iPod)
?>

is_tablet はもちろん、is_iOS とか便利!

さらに〜〜

<?php
is_iphone();
is_ipad();
is_ipod();
is_android();
is_blackberry();
is_opera_mobile();
is_symbian();
is_kindle();
is_windows_mobile();
is_motorola();
is_samsung();
is_samsung_tablet();
is_sony_ericsson();
is_nintendo();
?>

とかまで!is_nintendo() て!笑 いや、気にしないといけないのかな…ブルブル😱

ということは〜〜

<?php
if (is_ios()) {
    wp_enqueue_style('ios', get_template_directory_uri() . '/ios.css');
}
?>

的なことも余裕でできちゃうわけで!

しかもbodyに端末のclassをつけてくれます!(重要)

例えば今私はPCなChromeで見ているので、その場合bodyに .desktop .chrome のクラス名をつけてくれます!激しく便利!

<body class="page page-id-5 desktop chrome">

というわけで、これはもうWordPressでのサイト構築にはデフォで入れても良いプラグインなんじゃないでしょーか。オススメです!

ではね!(前のめり