ユーザーエージェントででスマホとタブレットとOSとそれ以外を切り替える方法

公開日 : 最終更新日 :

カテゴリー :

前にWordPressでスマホとそれ以外を分ける方法としてWordPressの標準関数のwp_is_mobile()や切り替えるスニペットを紹介しましたが、現在のテーマを作成しているときにもうちょっといい感じにできないかなぁと思いテーマ制作がてらいろいろ考えてたらいい感じ!?にできたので紹介します。

スマホとタブレットを切り替える

前に紹介したスマホとタブレットとそれ以外とを切り替える関数は以下の感じでした。

上のコードはブラウザから送られるユーザーエージェントを見て以下の切り分けます。

  • スマホでアクセスしてときは「mobile」
  • タブレットでアクセスしたときは「tablet」
  • それ以外のユーザーエージェントでアクセスがあったら「other」

実際に使うとなるとこの関数に対してスマホなのかタブレットなのかを比較しないといけないのでちょっと面倒な関数でした。あとOSごとの切り替えをしたい場合の修正箇所がすこし多いのも難点なところです。

スマホとタブレットを切り替える その2

そこで関数の引数を指定して指定したもののユーザーエージェントがあればtrueを返すような関数を作ってみました。WordPressテーマで使いたい場合は、functions.phpに追加してください。

1つ目のコードとの違いは引数をswitch文で判定していることです。switch文にない引数はユーザーエージェントの判定をせずにfalseを返すようにしてあるもののみユーザーエージェントの判定をしてマッチしたらtrueを返すような関数です。ターゲットとする条件のロジックとユーザーエージェントを判定するロジックを分離することでターゲットとしたいユーザーエージェントを追加しやすくしています。上のコードではOS別の判定を加えてみました。

まとめ

match_os_useragent()もis_match()もWordPress限定だけではなくPHPの関数として動かせます。最近はスマホ対応でレスポンシブWEBデザインを使う場面が多いと思いますが、レスポンシブWEBデザインでカバーしたくないところではユーザーエージェントによる判定が多いと思うので使えるのではないかと思います。WordPressでfunctions.phpに書きたくない場合やプラグインでなんとかならんかといった場合には、mobbleというプラグインがあり、スマホ・タブレット・OS別といったものが簡単にできるのでおすすめです。

URL

ピンバック

コメント

名前とEメールアドレスが必須です。

以下のHTMLタグが使用できます。 <a href="" title="" rel=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong>