スマホの福業 ~在宅ワークで贅沢ライフ~

アドセンスをレスポンシブに対応させちゃおう!

こんにちは、Mr.桜井です。

今日はアドセンスをレスポンシブ対応させちゃう方法を書きます。
(ワードプレスでWP TOUCHを使ってる人は必要ないですからね~!)

 

まずは、【スマホ用サイズ】・【PC用サイズ】
それぞれのアドセンスタグを2つ用意します。

pcアドセンスタグ

スマホアドセンスタグ

タグが用意出来たら、
width = document.documentElement.clientWidth;

if ( width <= 480) { }
を足して下の部分を混ぜちゃえばOK!

 

↓これが合体後のお姿

アドセンスレスポンシブタグ

 

これで、横幅が480px未満の時は、
スマホ用のアドセンスが表示されるようになります♪

if ( width <= 480) { }
の480を変えれば、自分の好きなサイズに対応させる事が可能です。

 

if ( width >= 520) { }

<カッコ>の向きを変えて、
『520より大きい時』と指定するのもアリ♪

 

ほーら、簡単だったでしょ?
さあ、やってみよう!

URL :
TRACKBACK URL :

コメントはこちら

*
DigiPress
DigiPress

Return Top