Así de fácil es poner anuncios bajo el título de todas las entradas del blog (o cualquier otra parte)

Poner anuncios, ya sean de Adsense, Smowtion, Bidvertiser, etc es bastante sencillo, pero cuando queremos que estos aparezcan en el el cuerpo de todas las entradas, por ejemplo bajo el título o al final de estas, y de un solo paso, sin tener que editar una por una, puede no serlo tanto como parecía...

Colocar esta publicidad, anuncios o banners -realmente da igual el formato, puede tratarse de enlaces, vídeos, etc- es tan sencillo como copiar el código de nuestro anuncio en alguna parte del código de nuestro blog e intentar "invocarlo" para no tener código repetido en nuestro sitio.

ESENCIAL PARA ADSENSE Y OTROS

Además en el caso concreto de Adsense no se puede copiar el código del anuncio directamente en la entrada ya que no se mostrará. Con el resto de anuncios tales como los de Smowtion y Bidvertiser sí es posible copiar el código directamente en las entradas pero sin este método tendríamos que copiar en cada una de las entradas el código del anuncio, lo que podría ser una tarea demasiado tediosa..

PORQUE USAR ESTE MÉTODO

El método que os voy a explicar tiene varios beneficios:

1. Es muy rápido de implementar y afecta a todas las entradas publicadas y por publicar.
2. Funciona con todos los tipos de anuncio tipo banner y bloques de enlaces.
3. No viola ninguna norma ya que no se modifica el código de los anuncios (aunque sí tenemos que parsear los de Adsense para que los reconozca la plantilla de blogger).
4. Se puede modificar el anuncio o su tipo de en un solo paso afectando a todas las entradas solo con reemplazarlo en la plantilla.
5. Se puedo configurar. Con una etiqueta podremos modificar la ubicación del anuncio en el texto y podemos colocarlos centrados, a izquierda o derecha modificando el código original.
6. Podemos hacer que los anuncios aparezcan siempre o solo en las páginas de las entradas individuales.

El código está compuesto por un script y una opcional y simple etiqueta. Esta etiqueta la usaremos dentro de la entrada y en el lugar en que queramos que aparezca el anuncio para que sea sustituida por el código. Si no ponemos la etiqueta los anuncios se muestran por defecto debajo del título de la entrada.

CÓMO EMPEZAR 

Entra en tu blog y ve a "Diseño", seguido de "Edición de HTML", despliega los artilugios y busca esta etiqueta en el código fuente de tu plantilla:  <data:post.body/> (usa control + F para encontrarlo más rápido). Ahora reemplazalo totalmente por el siguiente código:

• Antes de copiar el código de Adsense o tu compañia elegida para ubicar en las entradas debes tener una cosa muy en cuenta. Debes parsear el código para que la plantilla de Blogger te la acepte; es XML y el código de Adsense es HTML así que te daría un error. Te quedarán unos símbolos muy extraños (tales como esto "quot;&gt") pero no te preocupes, funcionará bien.

<!-- sustituye a <data:post.body/> anuncios en las entradas --> 

<div expr:id='"aim1" + data:post.id'></div>
<div style="clear:both; margin:10px 0">
Aquí debes pegar el código de los anuncios
</div>
<div expr:id='"aim2" + data:post.id'>
<data:post.body/>
</div>
<script type="text/javascript">
var obj0=document.getElementById("aim1<data:post.id/>");
var obj1=document.getElementById("aim2<data:post.id/>");
var s=obj1.innerHTML;
var r=s.search(/\x3C!-- anuncio --\x3E/igm);
if(r>0) {obj0.innerHTML=s.substr(0,r);obj1.innerHTML=s.substr(r+16);}
</script>

<!-- sustituye a <data:post.body/> anuncios en las entradas -->

Ahora solo te falta copiar el código de tus anuncios en donde se indica en rojo. Cuando quieras puedes cambiar de compañía y automáticamente se actualizará en todas tus páginas. Maravilloso, ¿no? Espera...

UN PEQUEÑO DILEMA

Debéis tener en cuenta que cuando colocamos anuncios en las entradas ocurre algo que no muchos se esperan; En la página principal -y cuando se muestran varias páginas- solo se muestran anuncios en las primeras entradas -debido al límite de anuncios por página-, en las demás entradas simplemente desaparece dejando un hueco vacío.

Esto modifica la apariencia del blog de un modo que a veces no se desea, pero hay varias soluciones:

• Añadir un código extra para que solo se muestren anuncios en las páginas de entradas individuales. Si quieres que sólo sean visibles en las páginas individuales de cada un de ellas debes colocar tu código del anuncio entre las siguiente etiquetas:

• <b:if cond='data:blog.pageType == &quot;item&quot;'> Aquí es en donde debes copiar el código del anuncio </b:if>

• Reducir el número de entradas en la página principal para no exceder el número de anuncios (en el caso de Smowtion son 5 banners) para que el nº de entradas no sea mayor que el límite de anuncios. De este modo los anuncios se verán en las entradas de la portada y también de cada página individual.

Dependiendo del tipo de anuncio y sobre todo de su tamaño te convendrá más una opción que otra.

UNA ETIQUETA PARA INVOCAR ANUNCIOS

Además, ahora, cuando estés escribiendo una entrada y en el momento que desees que aparezca un anuncio, coloca la siguiente etiqueta dentro de la entrada:  <!-- anuncio --> En el lugar que la coloques -al principio, después el primer párrafo, del segundo, etc- aparecerá el anuncio cuyo código copiaste en tu plantilla.

Un ejemplo sería este:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. In mollis eleifend est a ultrices. Vestibulum consectetur eleifend feugiat.
<!-- anuncio -->
Curabitur mattis interdum faucibus. Nullam pellentesque magna in sapien mollis varius luctus quam egestas. Morbi sem lectus, condimentum eget rhoncus quis, dapibus vitae mi.

Si no se usa la etiqueta, los anuncios se muestran por defecto bajo el título. Notaréis que el resto de imágenes, texto y demás elementos que tengamos en nuestra entrada quedan justo por debajo del anuncio. En algunos casos interesaría que el texto quedase al lado del anuncio o que el anuncio se mostrase a la izquierda y no por debajo.

TIENES MÁS OPCIONES

Si por ejemplo deseas que el anuncio quede integrado como una imagen, entre el texto de la entrada, busca este fragmento que tienes más arriba en el código de la plantilla de tu blog:

<div style="clear:both; margin:10px 0"> y sustitúyelo por es este otro: <div style="clear: left; float: left; margin:10px 0">. Aquí tienes más información sobre las posiciones flotantes de estos elementos.

Notas y consejos:

• Nota: Si os encontráis con varias etiquetas <data:post.body/>, usad la primera.
• Nota: Creo que no se puede hacer con diferentes anuncios y usando diferentes etiquetas, si alguien es capaz, por favor, que avise.
• Consejo: Es recomendable hacer una copia de seguridad de tu plantilla.
• Consejo: Si estáis probando usad el botón de vista previa mejor que guardar.

Puedes seguir sacando el máximo partido a los banners con esta pequeña guía. Recordad que podéis hacerlo con cualquier campaña de publicidad que uséis.


¿Qué tal os ha parecido interesante? ¿Lo habéis usado, os ha dado algún problema o por el contrario ya habéis notado el aumento en los clicks?