2013

7

4

Google AdsenceをWordPress内でユーザーエージェント振り分けしてやんよ!!!

スポンサードリンク


当サイトですが、先日Google Adsenceを設置しました。
ですがこのサイト、一応簡易的にレスポンシブに対応してはいるんですが、アドセンスの広告バナーはJSなどフロントエンドサイドでのハック的な表示の切り替えはアドセンスのポリシー違反らしく、バナーの大きさを変えられないのがどうにもカッコ悪いのでなんとかしたいなぁと思っていたところ

俺メモ|WEB時々アプリ

ユーザーエージェント(User Agent)を取得してデバイスを判別するクラス

こちらのエントリーを参考にさせていただこう!!(ありがとうございますm(_ _)m)
ということで当サイト同様に
「このサイトWordPressのオリジナルテーマで作ってレスポンシブ対応してるけどサーバーサイドはあんまり得意くないからアドセンス振り分けできないよ(´・ω・`)しょぼーん」
な方向けにアドセンスを振り分けします。

ユーザーエージェント判別の外部ファイルを作成

『俺メモ|WEB時々アプリ』様のユーザーエージェント(User Agent)を取得してデバイスを判別するクラスのエントリーを元にアクセスしたデバイス毎にユーザーエージェント判別ファイルを作成します。
class UserAgent{
 
    private $ua;
    private $device;
 
    public function UserAgent(){
        $this->deviceCheck();
    }
 
    public function deviceCheck(){
         
        //ユーザーエージェント取得
        $this->ua = $_SERVER['HTTP_USER_AGENT'];
 
        if(strpos($this->ua,'iPhone') !== false){
            //iPhone
            $this->device = 'iphone';
        }
        elseif(strpos($this->ua,'iPad') !== false){
            //iPad
            $this->device = 'ipad';
        }
        elseif((strpos($this->ua,'Android') !== false) && (strpos($this->ua, 'Mobile') !== false)){
            //Android
            $this->device = 'android_m';
        }
        elseif(strpos($this->ua,'Android') !== false){
            //Android
            $this->device = 'android_t';
        }
        else{
            $this->device = 'pc';
        }
    }
 
    public function getDevice(){
        return $this->device;
    }
}
上記のソースを『UserAgent.php』として新規ファイルを作成します。
こちらのファイルを『wp-content/themes/テーマ名フォルダ/』のルートディレクトリ内にブチ込みます。
すると、管理画面の『テーマ編集』のテンプレート一覧に『UserAgent.php』が追加されます。

ユーザーエージェント判別ファイルの読み込み

上記のファイルを追加する事したら次にヘッダーテンプレート(header.php)の一番上に
<?php include( TEMPLATEPATH. '/UserAgent.php' ); ?>
を追加します。これでユーザーエージェント判別ファイルが読み込まれました。

Adsenceスクリプトの条件分岐

最後に広告読み込みスクリプト箇所に
$ua = new UserAgent();
	switch($ua->getDevice()){
		//PCデバイス時の出力バナー
		case pc:
			echo ('
				<script type="text/javascript"><!--
				google_ad_client = "adsenceクライアントナンバー";
				/* バナー名 */
				google_ad_slot = "adsenceスロット";
				google_ad_width = バナー横幅;
				google_ad_height = バナー縦幅;
				//-->
				</script>
				<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
				</script>
			');
		break;
		
		//ipadデバイス時の出力バナー
		case ipad:
			echo ('
				・・・・・・・
			');
		break;
		
		//Androidデバイス時の出力バナー
		case Android:
			echo ('
				・・・・・・・
			');
		break;
		
		//iphoneデバイス時の出力バナー
		case iphone:
			echo ('
				・・・・・・・
			');
		break;
		
		//android_tデバイス時の出力バナー
		case android_t:
			echo ('
				・・・・・・・
			');
		break;	
		
	}
上記の記述内にデバイス毎に表示させたいバナーサイズのコードを追加してください。

当サイトも同上の方法でPC・スマホの各デバイスからのアクセス時のユーザーエージェント判別により、表示広告を分けてます。
さぁレッツクリック!!へ(-_- )ポチットナ


トップへ