iPhoneサイトに、AdMob広告を入れる。

互換インクならこちら

昨年、Googleが7億5千万ドルでM&AしたAdMob社ですが、
Androidのインプレッション数は、2倍になったそうです(2009/01/15)
http://jp.techcrunch.com/tag/admob/

iPhoneアプリだけでなく、webにも対応してるとのことなので、
IDEA*IDEAさんの記事を参考にさせて頂きながら、
Webサイトに入れてみました。

AdMobに、登録します。

AdMobサイトに行き、
「今すぐスタート」ボタンを押します。

登録情報を入力します。

登録メールに、認証メールが送信されるので、メールを開いて、URLをクリックし、登録を完了させます。

サイトを追加する

「サイト及びアプリケーション」ー「サイト/アプリケーションの追加」を選択します。

「サイトまたはアプリケーション タイプの選択」から「iPhone用サイト」を選択します。

広告を貼るサイトの情報を入力します。広告の色なども選択できます。

次に進むと、広告のJSコードが表示されます。

広告コードのサンプル

<script type="text/javascript">
var admob_vars = {
 pubid: '*******', // publisher id
 bgcolor: '333333', // background color (hex)
 text: 'eeeeee', // font-color (hex)
 test: true// test mode, set to false if non-test mode
};
</script>
<script type="text/javascript" src="http://mm.admob.com/static/iphone/iadmob.js"></script>

注意）

 test: false// test mode, set to false if non-test mode

デフォルトだと、「test:true」になっていて、テストモードで課金されなくなっているので、「test:false」に変更します。

iPhoneサイトの、広告を挿入したい場所に、広告コードを埋めます.

wptouch/themes/default/header.phpに広告コード埋めます。

次の例は、タイトルヘッダーと、Searchの間に、広告を入れた時の例です。
特に、どこに埋めても良いようなので、入れたい位置にいれてください。

	</div>
</div>
<!-- AdMob -->
<div class="admob-area">
<script type="text/javascript">
var admob_vars = {
 pubid: 'xxxxxxxxxxx', // publisher id
 bgcolor: '333333', // background color (hex)
 text: 'eeeeee', // font-color (hex)
 test: false // test mode, set to false if non-test mode
};
</script>
<script type="text/javascript" src="http://mm.admob.com/static/iphone/iadmob.js"></script>
</div>
<!-- /AdMob -->
<div id="drop-fade">
	<?php if (bnc_is_search_enabled()) { ?>
    	<a id="searchopen" class="top" href="#" onclick="bnc_jquery_search_toggle(); return false;"><?php _e( 'Search', 'wptouch' ); ?></a>
	<?php } ?>

ついでに、style.cssも加えました。

/* for AdMob */
admob-area {
        width: 100%;
	height: 48px;
	display:block;
}
/* end for AdMob */

そして、ついでに、解析コードを、footer.phpに加えます。
PHPの場合、なぜか、最後の「?>」が抜けていて、そのまま貼ると
エラーになるので要注意。

自分は、GoogleAnalyticsも使用しているので、その解析コードも挿入しました。

さて、これでAdMob広告の挿入は完了です！
iPhoneから接続して確認してみてください。

※wptouchプラグインをアップグレードすると、/themesファイル内も
　上書きされてしまうので、バックアップは取っておいた方が良いです。