jQuery Mobile を使っているサイトで Google Adsense が上手く表示されない事があります。
これは、 jQuery Mobile が デフォルトで Ajax式のハイパーリンクを有効しているから。
これが Google Adsense に悪さをしています。
Google Adsense は、１つのページに広告は３つまでにしてくださいという規約があります。
それ以上の数を表示しようとすると表示しませんよ、と言っています。
jQuery MobileのAjax式のハイパーリンクは、リンク先のページを非同期通信で読み込み、表示中の文書ツリーに取り込んだ上でページを遷移します。
その、表示中の文書ツリーに取り込んだ時点でバナーの数が３つを超えたら、バナーが表示されない、またはバナーだけが表示されてしまう（ことも環境によりあるらしい）ように見えます。
※詳しくは検証していません。また、Googleの仕様やjQueryの仕様変更によりこの現象は再現されなくなるかもしれません。
で、どうすれば Google Adsense の表示がされるのか。
Ajaxを利用しないハイパーリンクにします。
jQuery Mobaile がページ全体をリフレッシュするような、通常のリンクとして処理するのは次の場合です。
- リンク先が現在のドメインと異なる
- 「rel=”external”」属性が指定されたアンカータグ
- 「data-ajax=”false”」属性が指定されたアンカータグ
- リンク先ページの表示ウインドウを指定するtarget属性が付加されたアンカータグ
例えば、
<a href="test.html" data-role="button" rel="external">リンク</a>
こうした場合は、クリック時にAjaxは無効になります。
が、こんなものを全てのリンクに設定するのは面倒なので
jQuery、jQuery Mobileをページに読み込んだ後に、
$.mobile.ajaxEnabled = false;
を記述してAjaxを全て無効にしてしまう方法もあります。
1件のコメント