モバイル端末とPCでコンテンツを切り替えできるWordPressの便利な関数

レスポンシブデザインのサイトを作る機会が増えてきました。
(ずいぶん昔にもリキッドレイアウトなんて呼ばれて、可変レイアウトで騒いでたよな……。)

メディアクエリを使ってCSSを分岐させれば良いだけならあまり悩む事もないのですが、
ワンソース・マルチデバイスではどうにも行き詰まってしまうな、といった場面もあったりします。
既存のPCサイトを活かして作りたいけど、このままスマホ向けにレイアウトしても使い勝手が悪いな、とか。
スマホならこのレイアウトで良いけど、PC向けに整えようとするとちょっとイマイチ、とか。

探してみたら「 wp_is_mobile() 」 なんて便利な関数がありました。
WordPressの3.4から実装されている関数で、下記をモバイル端末として分岐してくれるようです。

  • all iPhone, iPad, etc.
  • Android
  • Silk/
  • Kindle
  • BlackBerry
  • Opera Mini
  • Opera Mobi

こいつを使って、PC用とモバイル用を切り替え。

if(wp_is_mobile()):
  //モバイル端末向けのコンテンツ
else:
  //PC向けのコンテンツ
endif;

PCとスマホでコンテンツ切り替えたいんだけど、余計なJqueryは使いたくない!
そんな方にはピッタリの関数かもしれません。

ただ、フィーチャーフォンもスマートフォンもタブレット端末も全部 “モバイル” なんですね。
この関数に関して、スマホとPCで切り替えなんて言い方だと語弊があるなって改めて思います……。
iPadなどのタブレット端末、更にもっと細かいUAで分けたいという場合は
function.phpで関数を自作して実装することになります。
ただ、新しい端末が出てくるたびにメンテしないといけないって考えると、
ちょっと面倒かもしれないな、という印象です。

こういう分岐していると、
アダプティブのことも考え初めてとりとめ無くなりそうだな、と思うyukaでした:sayonara:

トラックバックURL