【WordPress・PHP】 スマホとPCを判断する条件分岐|iPhone・Android

今回は、WordPressでサイトを制作していると、スマートフォン・タブレット・PCによって、表示される内容や処理を変更したい場合があるかもしれません。

今回は、そのような場合に使用できる例となり、スマホ・タブレット・PCの条件分岐を行います。

また、例は以下の2パターンの条件分岐となります。

  • 「スマホ・タブレット」と「PC」の条件分岐
  • 「スマホ」と「PC・タブレット」の条件分岐

「スマホ・タブレット」と「PC」を判断する条件分岐

「スマホ・タブレット」と「PC」を判断する条件分岐は、WordPress関数のwp_is_mobile()があります。

以下、wp_is_mobile()を使用した条件分岐の例となります。

wp_is_mobileの例

以下を、「スマホ・タブレット」と「PC」の条件分岐を利用したい箇所に記述します。

<?php 
if( wp_is_mobile() ){
	// スマホ・タブレットの場合の処理を記述
}else{ 
	// PCの場合の処理を記述
}
?>

「スマホ」と「PC・タブレット」を判断する条件分岐

WordPressには、「スマホ」と「PC・タブレット」を判断する関数はありませんが、ブラウザのユーザーエージェントを使い、「スマホ」と「PC・タブレット」の条件分岐を行うことができます。

「スマホ」と「PC・タブレット」を判断する関数を作成

まずは、functions.phpファイル内に以下の関数を記述します。関数では、スマホでサイトにアクセスした場合を、ブラウザのユーザーエージェントを使い判断しています。

また、例ではスマホの条件を、iPhone・iPod touch・Androidスマホのデバイスとしています。

function my_is_mobile(){
    $pattern = '/iPhone|iPod|Android.*Mobile/i';
    return preg_match( $pattern, $_SERVER['HTTP_USER_AGENT'] );
}

作成した条件分岐の関数を使用する例

次に、以下を「スマホ」と「PC・タブレット」の条件分岐を利用したい箇所に記述します。

<?php 
if( my_is_mobile() ){
	// スマホの場合の処理を記述
}else{ 
	// PC・タブレットの場合の処理を記述
}
?>

ソースコードについて

functions.phpファイル内に作成したmy_is_mobile関数では、preg_match関数を使いスマホのデバイスを判断しています。

preg_match関数は、第2引数に指定した文字列を、第1引数に指定した正規表現で検索し、マッチした場合は1を返します。

今回の例では、第2引数にユーザーエージェントを取得できる定義済みの変数$_SERVER['HTTP_USER_AGENT']を指定し、第1引数にスマホのユーザーエージェントを検索する正規表現を指定しています。

指定した正規表現は、iPhone、iPod、Android.*Mobileのいずれかの文字列を検索するパターンとなり、スマホのデバイスを判断します。Android.*Mobileは、ユーザーエージェント内にAndroidとMobileの文字列がある場合となり、Androidスマホの場合を判断しています。

ユーザーエージェントの種類については、以下のリンク先を参考にしてみてください。

UserAgentからOS/ブラウザなどの調べかたのまとめ - Qiita

正規表現で複数の文字列を検索する場合

正規表現で複数の文字列を検索する場合、正規表現の可読性を高くするために、implode関数を使い正規表現を作成する方法もあります。詳しくは以下のリンク先を参考にしてみてください。

JavaScriptでスマホ・PCを判断

ユーザーエージェントを利用し、JavaScriptでスマホ・PCを判断することも可能です。詳しくは以下のリンク先を参考にしてみてください。

参照サイト・書籍

コメントまたはTwitterで返信

コメントは、以下の項目(*は必須項目)を入力し「コメントを送信」ボタンから送信お願いします。メールアドレスは公開されることはありません。Twitterで返信する場合はコチラから。