Entradas relacionadas en Blogger con miniaturas

En este tutorial te mostraré cómo colocar un bloque con miniaturas que muestre un conjunto de artículos relacionados con la publicación activa. Debes tener presente que ofreciendo contenido relacionado y sumándole la miniaturas lograrás invitar de una forma elegante al lector a descubrir más contenido en tu blog, además, este tipo de soluciones debe repercutir en la cantidad de páginas vistas de tu blog y por consecuencia en el tiempo medio de estancia. Recuerda que este elemento es uno de los 5 elementos claves de un blog



Hasta ahora había usado enlaces relacionados al pie de la entrada, proporcionado por un script de BloggerTrix (truco nº 16 de la lista de los 50 mejores trucos para Blogger). Ya que he potenciado mis publicaciones mediante imágenes, vamos a aprovecharlas para este nuevo bloque de contenido relacionado con miniaturas que vamos a instalar.

Contenido relacionado con miniaturas al pie de las publicaciones en Blogger

Para lograr este objetivo he analizado estos cuatro servicios; LinkWithin, OutBrain, AddThis, Engageya, veremos los pros y los contras y te ayudaré a identificar cual de ellos se ajusta a tus necesidades. Existen otros como Taboola, NRelate o Zemanta (WordPress) que te los dejos como dato adicional por si quieres verlos y analizarlos.

¿Dónde debe aparecer el bloque el contenido relacionado?

Independientemente de cual de los servicios que vamos a ver a continuación elijas como proveedor del script necesario para lograr tu objetivo, me gustaría llegar a un consenso contigo y es que el bloque con los artículos relacionados, debe aparecer sólo y únicamente al pie de la entrada activa, es decir, tienes que estar dentro del artículo para ver el contenido relacionado. Te lo digo porque he visto muchos blogs que muestran los artículos relacionados en la vista inicial del blog debajo de cada entrada, esto debemos considerarlo una mala práctica ya que estas sobre cargando demasiado el vista inicial de tu blog, volviéndola muy lenta, pesada por lo que influirá negativamente en el posicionamiento.

Un análisis rápido de cada servicio para situarte

Te voy a ser muy sincero, si lo que buscas es algo sencillo, fácil de implementar en el blog y sin complicaciones adicionales tu servicio es LinkWithin. Si por el contrario, quieres "complicarte" un poquito más y registrarte en un servicio gratuito que además del script, te va a proporcionar diferentes estilos y estadísticas mensuales, tu servicio puede ser Engageya (aunque en mi caso me he encontrado con un problemita que te explicaré luego). Si quieres subir un poco más el nivel y tener acceso a estadísticas en tiempo real, opciones de monetización, contenido externo recomendado, el servicio que buscas es OutBrain. Si quieres ir un poco más allá y además de las estadísticas quieres dotar a tu blog de otros elementos como una barra flotante para compartir las entradas o  un bloque para recomendar la próxima lectura y todo gracias a un mismo proveedor entonces lo que buscas son las capas inteligentes o smart layers de Addthis.

Tabla comparativa con las características más importantes

He creado una tabla comparativa utilizando una hoja de cálculo de Google Drive, con el fin de compartir contigo las características más destacada que he podido ver:

Modificando la plantilla de Blogger para incrustar el gadget

Este es un paso que deberemos realizar si o si, independientemente del proveedor que elijas finalmente. El objetivo es identificar dentro de la plantilla de Blogger el punto exacto donde luego incluiremos el script correspondiente. Para ello, realiza estos pasos.

• Paso 1. Conecta con Blogger
• Paso 2. Acceder a la pestaña Plantilla
• Paso 3. Haz copia de seguridad usando el botón Crear/Restablecer copia de seguridad
• Paso 4. Presiona el botón Plantilla HTML
• Paso 5. Sitúa el cursor del ratón en cualquier linea del editor
• Paso 6. Pulsa Ctrl F o Ctrl B 
• Paso 7. Pon este texto en el buscador de la plantilla <data:post.body/> , da intro y vuelve a dar otro intro, si encuentras otra linea igual, es la segunda.
• Paso 8. Copia este bloque de código y pégalo justo debajo de la linea encontrada en el paso anterior.

<b:if cond='data:blog.pageType == "item"'> <!--Entradas relacionadas con miniaturas. --> <!--El script del proveedor que selecciones va debajo de esta linea --> </b:if>

• Paso 9. Guarda la plantilla y no debe presentar ningún problema.

Ya hemos creado el hueco donde pondremos posteriormente el script (debe ir por encima de la linea </b:if>) que nos proporcione el proveedor que selecciones finalmente. Ahora te hago un resumen de cada uno de ellos y los pasos que debes dar para obtener dicho script.

LinkWithin

Como te mencionaba anteriormente, LinkWithin es el más sencillo de implementar, no necesita registro y si no te quieres complicar la vida es muy recomendable. El script funciona si bien es cierto que el servicio parece estar inactivo en cuanto a actualizaciones se refiere. Pese a todo se ha convertido en todo un clásico. Puedes mostrar 3, 4 ó 5 miniaturas. Este gadget suele verse mucho en blogs de cocina, moda, cine, etc.

Sigue estos obtener el script

• Paso 1. Copia el siguiente código.


<div class='linkwithin_div'/> <script> var linkwithin_site_id = TU_ID_AQUI ; </script> <script>linkwithin_text='Quizás también te interese estos temas: '</script> <script src='http://www.linkwithin.com/widget.js'/> <a href='http://www.linkwithin.com/'><img alt='Related Posts Plugin for WordPress, Blogger...' src='http://www.linkwithin.com/pixel.png' style='border: 0'/></a>

• Paso 2. Pégalo en tu plantilla, en el lugar que ya habíamos previsto para ello.
• Paso 3. Conecta ahora con LinkWithin
• Paso 4. Cumplimenta el formulario
• Por tu email
• Blog link: La dirección de tu blog
• Plataform: Selecciona Other
• Width: El numero de niniaturas que quieres mostrar (de 3 a 5 historias)
• Marca la casilla si tu blog tiene fondo oscuro
• Presiona el botón Get Widget 
• Paso 5. Se mostrará otra ventana con el código, copia solo el número o id
• Paso 6. Vuelve a Blogger
• Paso 7. Cambia donde hemos puesto TU_ID_AQUI por el número copiado anteriormente
• Paso 8. Guarda tu plantilla,  visualiza tu blog y entra en un post. Al pie debes ver las entradas relacionadas con miniaturas. ¡Enhorabuena!

Engageya

Las sensaciones con este proveedor son muy buenas, una de las cosas que más me ha gustado es que tiene varios estilos para mostrar los artículos relacionados, desde miniaturas redondas, rectangulares, cuadradas y así hasta 16 variantes diferentes (fantástico!). Además puedes asociar a tu blog en diferentes categoría o temáticas y puedes decir si quieres mostrar artículos relacionados de terceros bajo tu misma temática.

Sin embargo, en mi caso que ofrezco un feed corto desde mi blog (y no la entrada completa) la miniaturas que muestra nada tiene que ver con mis post ni con la temática de mi blog y esto me ha desanimado un poco, sin embargo insisto que puede ser útil para ti evaluarlo. Ofrece estadísticas mensuales que nos permitirán ver por ejemplo los clics recibidos y las publicaciones correspondientes. Vale la pena conocerlo.

Sigue estos obtener el script:

• Paso 1. Debes registrarte en Engageya
• Paso 2. Cumplimenta los campos del formulario, presta especial atención a la cuenta de email y dirección de tu blog
• Paso 3. Conecta con tu buzón de correo electrónico y copia el código que te habrás recibido.
• Paso 4. Pégalo en el formulario y presiona el botón Sign Up
• Paso 5. Accederás al constructor del Widget, cumplimenta y personaliza todo lo que creas conveneniente
• Paso 6. En el apartado Plantaforma, selecciona JavaScript Any Plataform 
• Paso 7. Cuando estés listo presiona el botón Save & Get Code
• Paso 8. Copia el código que te ofrece
• Paso 9. Vuelve a Blogger y pégalo en el sitio que teníamos previsto.
• Paso 10. Guarda tu plantilla,  visualiza tu blog y entra en un post. Al pie debes ver las entradas relacionadas con miniaturas. ¡Enhorabuena!

Nota: Según nos indica Engageya puede tardar 30 minutos en aparecer en tu blog, por lo tanto paciencia.

Outbrain (el usado por iniciaBlog)

OutBrain parece consolidarse como un buen referente. A parte de las estadísticas en tiempo real, ofrece también la posibilidad de ofrecer contenido de terceros en tu blog, dentro de la misma temática y donar directamente tus ingresos a ONGs internacionales, tipo Cruz Roja, Children.org, Protección cambio climático entre otras. Puedes indicar la cantidad de artículos relacionados entre 1 y 10 y si los quieres con o sin miniaturas.

El cuadro de mandos que ofrece es bastante intuitivo y repito es el que parece consolidarse como estándar. También te permitirá (de pago) ofrecer tus contenidos a su red con el fin de adquirir más tráfico y seguidores hasta tu blog.

En este caso Outbrain ofrece cara a instalar el script un icono con la plataforma Blogger. Esto permite añadir un gadget a la vista diseño de tu blog aunque sin embargo lo que haremos es copiar el contenido de ese Gadget, lo eliminamos de la vista diseño del blog y lo pegamos en el hueco que habíamos creado en la plantilla. Uff parece complicado, pero no te preocupes, vamos paso a paso.

Sigue estos obtener el script:

• Paso 1. Debes registrarte en Outbrain
• Paso 2. Cumplimenta los campos del formulario, usuario, contraseña y email
• Paso 3. Acepta los términos y haz clic en el botón Register
• Paso 4. Se mostrará una nueva página donde indica que debes revisar tu correo electrónico para confirmar la suscripción.
• Paso 5. Accede a tu buzón y confirma haciendo clic en el enlace del correo electrónico
• Paso 6. Pulsa el apartado de Manage Blog  y añade tu blog
• Paso 7. A la pregunta Install widget? indica Yes
• Paso 8. En el apartado Plataforma selecciona Blogger
• Paso 9. Indica Blog URL, ejemplo http://www.iniciablog.com y selecciona el lenguaje
• Paso 10. Elije el tipo de recomendación (Miniaturas o texto)
• Paso 11. Acepta los términos de uso y pulsa el botón Continue
• Paso 12. Se abrirá una nueva ventana, debes abrir seleccionar tu blog
• Paso 13. Pulsa el botón Añadir Artilugio
• Paso 14. Ve a Blogger a la pestaña Diseño
• Paso 15. Fíjate que tienes un Gadget nuevo (en la parte de la derecha, el primero). En el título pone Ratings an Recommendations...
• Paso 16. Pulsa el enlace Editar del gadget en cuestión
• Paso 17. Copia el código script que te aparece en la ventana que se muestra. Asegúrate por favor de haberlo seleccionado todo. Este es el script que ahora pondremos en el hueco creado en el paso previo dentro de la plantilla. Una vez copiado debes pulsar el botón Eliminar y guarda el diseño.
• Paso 18. Vuelve a la Plantilla HTML y pégalo en el sitio que teníamos previsto.
• Paso 19. Guarda tu plantilla,  visualiza tu blog y entra en un post. Al pie debes ver las entradas relacionadas con miniaturas. ¡Enhorabuena!

Nota: Según nos indica Outbrain,  puede tardar varios minutos en aparecer en tu blog, por lo tanto paciencia.

Smart Layers de Addthis

A mi modo de ver las cosas, considero que Addthis es el proveedor más completo, además tienes una página DEMO para que puedas verlo. Addthis ofrece además del bloque de artículos relacionados contempla otros gadgets, como por ejemplo la barra flotante para compartir en medios sociales. Todos dirigidos a lograr una mayor interactividad con nuestros lectores.

Al igual que ocurre con Outbrain, Addthis tiene soporte para Blogger, por lo que lo aprovecharemos para añadir automáticamente el Gadget en la vista diseño del blog, copiaremos el código, eliminaremos ese gadget y pegaremos finalmente el código en el hueco previsto, dentro de la plantilla de tu blog, ánimo!. Sin embargo con Addthis prefiero quedarme por aquí y dejarte a la aventura de probarlo tu mismo y así le damos un poco más de emoción a la cosa ¿te parece?. Conecta con AddThis y echa un vistazo.

Conclusiones

Como habrás podido ver todos y cada uno de estos servicios satisface el objetivo de incorporar a nuestro blog un bloque con contenido relacionado y miniaturas al pie de la entrada activa. En función del momento, del grado de exigencia podrás de cantarte por cualquiera de ellos.

En mi caso y como ya podrás ver al pié de esta entrada, hemos seleccionado OutBrain.

Por favor deja tu comentario, un abrazo.