martes, 30 de junio de 2009

Cómo añadir Adsense en los posts del nuevo Blogger (antes beta)

Sacado de Blogmundi


El título en bastante largo y puede asustar, pero el proceso no es tan díficil. Puede que lo hayas intentado o no, pero cuando quieres añadir código Adsense directamente en la plantilla del blog en Blogger para, por ejemplo, añadir bloques de anuncios en los posts, el sistema nos avisa de que existe un error y es por lo estricto de la estandarización XML del nuevo Blogger.

Bien, la solución pasa por hacer un pequeño retoque en el código Adsense, estarás pensando, pero eso está prohibido! En Blogcrowds se han encargado de realizar las gestiones oportunidades para conocer la opinión de Google Adsense al respecto y parece que esta modificación cumple las condiciones del programa, al no alterar de forma alguna el formato, la fuente o tratar de ocultar el “Anuncios Google”.

Pero si lo vemos con un ejemplo seguro que entiendes mejor por qué:


Éste es el código que nos proporcionan:



<script type="text/javascript"><!--


google_ad_client = "pub-XXXXXXXXXXXXXXX";

google_ad_width = 336;

google_ad_height = 280;

google_ad_format = "336x280_as";

google_ad_type = "text_image";

google_ad_channel = "";

google_color_border = "FFFFFF";

google_color_bg = "FFFFFF";

google_color_link = "000000";


google_color_text = "000000";

google_color_url = "000000";

//--></script>

<script type="text/javascript"

src="http://pagead2.googlesyndication.com/pagead/show_ads.js">

</script>

No obstante debemos transformarlo a lo siguiente para que Blogger lo acepte, es decir, cambiar los símbolos “<>” por su entidad HTML “< > ” y con las comillas igual. Puedes hacerlo manualmente, no obstante en Blogcrowds han desarrollado un sistema que lo hace por tí.
Aca otros dos sistemas: 

Blogger Ad Code Converter






<script type="text/javascript"><!--

google_ad_client = "pub-XXXXXXXXXXXXXXX";

google_ad_width = 336;

google_ad_height = 280;

google_ad_format = "336x280_as";

google_ad_type = "text_image";

google_ad_channel = "";

google_color_border = "FFFFFF";


google_color_bg = "FFFFFF";

google_color_link = "000000";

google_color_text = "000000";

google_color_url = "000000";

//--></script>

<script type="text/javascript"

src="http://pagead2.googlesyndication.com/pagead/show_ads.js"

>

</script>


Eso es todo, cuando accedas a tu blog, los bloques de anuncios se mostrarán donde tu quieras. No obstante, por si no sabes bien donde colocarlos vamos a ver una serie de ejemplos:

En primer lugar debes acceder a la edición de tu plantilla del blog. “Plantilla -> Edición HTML” y recuerda activar “Expandir plantilla de artilugios”

1) Al lado del post

Si te has fijado en este blog hay un bloque de anuncios pequeño al empezar el post en su lado derecho, sería el equivalente a lo que vamos a hacer ahora, ¿cómo colocas un bloque igual?



<div style="float:left;">

<!–el código creado de Adsense–>

</div>


<div class=’post-body’>

<p><data:post.body/></p>

<div style=’clear: both;’/> <!– clear for photos floats –>

</div>


Nota para el Centro del Post <div style="text-align: center;">










2) Después del post antes de los créditos.

Es decir, entre el final del artículo y el “Publicado por…”, “Comentarios”


<div class='post-body'>

<p><data:post.body/></p>

<div style='clear: both;'/> <!-- clear for photos floats -->

</div>

<div> <!–el código creado de Adsense–> </div>


<div class=’post-footer’>

<p class=’post-footer-line post-footer-line-1′>

<span class=’post-author’>

<b:if cond=’data:top.showAuthor’>

<data:top.authorLabel/> <data:post.author/>

3) Después de los créditos

<p class='post-footer-line post-footer-line-3'/>


<div> <!–el código creado de Adsense–> </div>

</div>

</div>

</b:includable>

</b:widget>

</b:section>



Si surge algún error comprueba que has copiado y pegado todo correctamente, por lo demás, es así de sencillo!