【WordPress】スマホとタブレット/PCで広告を変えるための条件分岐

レスポンシブで作成したサイトの広告をスマホとそれ以外で分けたいと考えています。
条件分岐をの関数を用意しましょう。

スポンサーリンク

is_mobile関数

WordPressにはwp_is_mobileという関数が用意されていますが、この関数ではタブレットもスマホと同じモバイルデバイスとして振り分けてしまいます。
タブレットはPCと同じ広告を表示させたいため、新たに振り分け関数is_mobileを用意します。

こちらを参考にさせていただきました。
【WP初心者向け】is_homeとis_mobileを使ってカスタマイズの幅を広げよう!(Naifix)
http://naifix.com/is_home-and-is_mobile/

以下のコードを子テーマのfunctions.phpに追加します。

function is_mobile(){
	$useragents = array(
		'iPhone', // iPhone
		'iPod', // iPod touch
		'Android.*Mobile', // 1.5+ Android *** Only mobile
		'Windows.*Phone', // *** Windows Phone
		'dream', // Pre 1.5 Android
		'CUPCAKE', // 1.5+ Android
		'blackberry9500', // Storm
		'blackberry9530', // Storm
		'blackberry9520', // Storm v2
		'blackberry9550', // Storm v2
		'blackberry9800', // Torch
		'webOS', // Palm Pre Experimental
		'incognito', // Other iPhone browser
		'webmate' // Other iPhone browser
	);
	$pattern = '/'.implode('|', $useragents).'/i';
	return preg_match($pattern, $_SERVER['HTTP_USER_AGENT']);
}

現在流通しているスマホのユーザーエージェントに適合するなら「スマホ」しないなら「タブレットかPC」という処理です。
つまりユーザーエージェントが変わる新しい規格のスマホが出てきた時にはこの一覧に加える必要があるということです。
時折見直しが必要ということを覚えておきましょう。

$pattern = '/'.implode('|', $useragents).'/i';
return preg_match($pattern, $_SERVER['HTTP_USER_AGENT']);

implodeでユーザーエージェント配列を連結し、preg_matchでマッチングしています。
$patternの最後の’i’はpreg_matchでマッチングする際に大文字小文字を問わないという指定です。

またAndroidとWindows Phoneはタブレットサイズでも同じユーザーエージェントを吐くため、スマホ端末を示すMobileとPhoneをマッチング条件に追加しています。

使い方

追加したい箇所に以下の様な処理を記載します。

<?php if(is_mobile()) { ?>
	スマホ用広告コード
<?php } else { ?>
	タブレット/PC用広告コード
<?php } ?>

この処理はスマホとそれ以外で広告バナーの配置を変えるときに使えます。
いろいろ試してみて最適な広告サイズと配置を決めていきたいと思います。


スポンサーリンク
  • このエントリーをはてなブックマークに追加

コメントをどうぞ

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA