miércoles, 25 de marzo de 2015

Bootstrap AdWords Responsive

Supongamos que tenemos una página perfectamente trabajada en Bootstrap (o en otra cosa) y además full responsive y en ella decidimos poner un anuncio de AdWords de 160 x 600 dentro de por ejemplo, un panel (o cualquier otro elemento contenedor). Algo así como lo marcado en rojo...



El caso es que cuando cambiemos el tamaño de pantalla para adaptarnos a otro dispositivo se mantendrá el tamaño del anuncio (lógicamente ya que sigue siendo 160x600):




Recordemos que el código para poner un anuncio AdWords es éste:

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
style="display:inline-block;width:160px;height:600px"
data-ad-client="ca-pub-xxxxxxx"
data-ad-slot="xxxxxxx"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

Pues bien... sólo hemos de realizar los siguientes cambios:

<script async src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
style="display:block"
data-ad-client="ca-pub-xxxxxxx"
data-ad-slot="xxxxxxx"
        data-ad-format="auto"></ins>
<script>
(adsbygoogle = window.adsbygoogle || []).push({});
</script>

Y ya está... ahora nuestra página en tamaño smartphone quedará así:



NOTA DE FURNI:   Responsive es un palabro muy feo y una americanada. Nuestra lengua tiene el bonito vocablo Adaptativo para referirnos a lo mismo. Que se note que semos leídos y escribidos.

No hay comentarios:

Publicar un comentario