WordPressでのデバイス振り分けプラグインの決定版「mobble」

Tweet

schedule2013.04.20

visibility4505

閲覧者の環境に最適化させる方法としては、デバイスに応じてサイトを複数作ったり、レスポンシブにしたり色々な対応法が考案されていますが、かなり手間がかかります。

簡易的に対応する方法として僕は、基本のコンテンツがあり、PCで見る時に表示するもの、タブレットやスマホで見る時に非表示にするものなどをそれぞれ個別に指定出来れば便利だなぁと思っていたのですが、理想的なプラグイン「mobble」を見つけました。

何ができる?

WordPressには条件分岐タグという関数が用意されています。例えばサイトのトップページが表示されている場合にtrueを返すis_front_page()。固定ページが表示されている場合にtrueを返すis_page();などがあります。

「mobble」はオリジナルの条件分岐タグを追加するプラグインです。
追加される条件分岐タグは下記のようなものがあります。

基本的なタグ

↑の4つをiPhone 4sで確認したところ、is_mobile、is_ios、is_handheldは「true」が、is_tabletは「false」が返って来ました。

更に詳細なタグ

細かく調整したい場合はこのようなタグも使えます。

使い方

テーマ内のphpファイルに書き込みます。

この場合、モバイル(iPhoneやAndroidなど)以外のデバイスで見た場合のみサイドバーが表示されます。

またPC用のタグはありませんが、下記の書き方でPC表示時の動作を指定出来ます。

ここも便利!

「mobble」を導入すると、bodyタグに自動的にデバイス名のclassを追加してくれます。
PCで見た場合

と言った感じです。
これを利用すればcssからdisplay:noneで非表示にしたり、デザインの調整も可能です!

mobble管理画面

デフォルトでオンになっている機能ですが、設定画面からオフにすることも可能です。

ご注意ください

Quick CacheWP Super Cacheのような、ページのキャッシュを保存して表示速度を早めるプラグインとの併用はできません。
閲覧デバイスに関わらずキャッシュに保存されている内容が表示されてしまうので、意図する動作を得られないはずです。

2014 © Webgoto