Adsense - Anúncios responsíveis via Javascript
Como fazer anúncios responsíveis usando Javascript
A ideia é verificar o tamanho da tela do usuário e em seguida, baseado nos valores, mostrar os anúncios nos tamanhos corretos.
No meu caso eu configurei o seguinte esquema:
Veja o código fonte do exemplo:
Você utiliza o Twitter Bootstrap? Se sim, você pode conseguir o mesmo resultado de maneira muito mais simples. Veja aqui!
No meu caso eu configurei o seguinte esquema:
- Padrão Desktop
- Leaderboard (728x90)
- Padrão Portrait tablet to landscape and desktop
- Banner (468x60)
- Padrão Landscape phone to portrait tablet
- Banner (468x60)
- Padrão Landscape phones and down
- Half Banner (234x60)
<script type="text/javascript">
google_ad_client = "ca-pub-XXXXXX";
google_ad_slot = "";
if(window.innerWidth >= 800) {
//visible-desktop
//Medium Rectangle
google_ad_slot = "xxxxxxx";
google_ad_width = 300;
google_ad_height = 250;
}
else if((window.innerWidth > 480)&&(window.innerWidth < 800)) {
//visible-tablet
//Square
google_ad_slot = "xxxxxxx";
google_ad_width = 250;
google_ad_height = 250;
}
else if(window.innerWidth <= 480) {
//visible-phone
//Large Rectangle
google_ad_slot = "xxxxxxx";
google_ad_width = 336;
google_ad_height = 280;
}
if(google_ad_slot != "")
document.write('1: <scr'+'ipt type=\"text/javascript\" src=\"http://pagead2.googlesyndication.com/pagead/show_ads.js\"></scri'+'pt>');
</script>
Você utiliza o Twitter Bootstrap? Se sim, você pode conseguir o mesmo resultado de maneira muito mais simples. Veja aqui!



No comments:
Post a Comment