Widget de posts relacionados para Blogger (I): Linkwithin

A muchos de nosotros nos llama la atención el colocar un widget de entradas relacionadas en nuestro blog porque es una forma de promocionar dentro del propio blog otros artículos que le pueden resultar interesantes a nuestros visitantes, generando así más tráfico para nosotros y al mismo tiempo, nuestro visitante descubre mayor contenido de utilidad. Así ¡todos ganamos!

Hay varias opciones en las que podemos colocar un widget de contenido relacionado en nuestro blog, por lo que he decidido crear una serie de post sobre este tema. Así que en las siguientes entradas, podremos observar tres opciones de widgets para colocarlas, entenderlas mejor y decidir cual es la que más nos conviene.

Para este post en específico hablaré el widget de LinkWhithin es la mejor opción para quien empieza en el mundo de los blogs y aún tiene miedo de tocar la plantilla html del blog aunque también resulta de utilidad a los muy experimentados, por lo que es altamente recomendable.  Este widget es tan confiable que la uso en La Taberna de Julio.

Contenido

1. Generar el Widget de LinkWithin.
2. Colocar el Widget en Blogger.
3. Modificar el mensaje del widget.

Las primeras dos son obligatorias, mientras que la tercera es opcional, pero si la hacemos dejaremos mas bonito el widget. Bueno, sin mas retrasos vamos al tutorial.

1. Generando el widget de LinkWithin

Para generar el widget solo debemos seguir estos sencillos pasos:

1. Ve a LinkWithin.

2. Rellena el formulario: en donde dice 'Platform' seleccionaremos la opción Other. Marca la casilla si nuestro blog es de fondo obscuro. 

3. Al terminar, presiona Get Widget! para obtener el código html.

4. Copia el código que te ofrece en un bloc de notas, pues mas adelante lo usaremos.

2. Colocar el Widget en Blogger

Ahora colocaremos el widget en Blogger. El chiste de este tutorial es buscar que el widget aparezca debajo de cada entrada sin que este aparezca en la página principal, es decir, el widget solo aparecerá cuando el visitante vea una entrada, esto con el fin de no entorpecer la carga del blog.

1. Ve a Blogger.

2. Después iremos a  Plantilla y después haremos clic en Editar HTML, justo como en la imagen de abajo.  ¡No olvides guardar la plantilla de tu blog!

Blogger > blog > Plantilla > Editar HTML

3. Una vez en la plantilla HTML, haremos clic dentro y luego pulsaremos ctrl+F. 

4. Busca la segunda etiqueta <data:post.body/> pulsando intro 2 veces.

5. Pega debajo de la etiqueta que acabas de buscar el siguiente código: 

<b:if cond='data:blog.pageType == "item"'> CÓDIGO HTML QUE LINKWITHIN NOS OTORGÓ </b:if>

6. sustituye las palabras en rojo con el script que nos proporcionó LinkWithin, de tal forma que todo quede como en la siguiente imagen:

Así es como se debería ver nuestra plantilla HTML con el Widget de LinkWhitin.

7. Guarda la plantilla y visualiza nuestro blog, para confirmar los cambios.

Nota: En caso de que no obtuvieras los resultados esperados, aplica los cambios en la siguiente etiqueta <data:post.body/>, y en caso de seguir sin obtener resultados, intenta con las demás hasta que des con la indicada. Por lo general funciona en la segunda etiqueta, pero cada blog es distinto, por lo que hay que probar en otras etiquetas si no funciona a la primera. Checa muy bien este paso, que es el que más problemas trae.

El código que vemos en el paso 5 es la condicional que evita mostrar el widget en la página principal, haciendo que solo se vea cuando se carga la entrada completa.


3. Modificar el widget de Linkwithin

Si no nos gusta la gris y robótica frase 'Quizás también le interese:' que trae por defecto el Widget, podemos cambiarla por una que nos guste más. Para esto hay que hacer lo siguiente:

1. ve al widget (Blogger > blog > Plantilla > Editar HTML)

2. Coloca el siguiente código: <script>linkwithin_text=' TEXTO QUE DESEAMOS COLOCAR '</script> de tal forma que quede así:  

<b:if cond='data:blog.pageType == "item"'>

<script>

var linkwithin_site_id = 0000000;

</script>

<script>linkwithin_text=' TEXTO QUE DESEAMOS COLOCAR '</script>

<script src="http://www.linkwithin.com/widget.js"></script>

<a href="http://www.linkwithin.com/"><img src="http://www.linkwithin.com/pixel.png" alt="Related Posts Plugin for WordPress, Blogger..." style="border: 0" /></a>

</b:if>

Cambia el texto en rojo por el que desees.
3. Guarda los cambios y observa el blog.

Conclusión

Utilizar el widget de LinkWithin no requiere registro, lo cual lo hace más interesante, y podemos elegir entre mostrar 3, 4 o 5 miniaturas, por lo que cumple a la perfección su función.  En lo personal me gusta mucho y lo recomiendo amplaimente. Claro, existen otros métodos mediante los cuales podemos colocar un widget de entradas relacionadas, pero eso queda para las siguientes entradas de la serie. 

Otros posts de esta serie:
- Widget de posts relacionados para Blogger (I): Linkwithin
- Widget de posts relacionados para Blogger (II): Shareaholic
- Widget de posts relacionados para Blogger (III): Script de enlaces relacionados

¿Te fue de ayuda este artículo?

Si el artículo te agrada puedes suscribirte a La Taberna para recibir las últimas actualizaciones del blog o bien, puedes dar me gusta en Facebook, seguir en Twitter o agregar a tus círculos de Google +. También puedes expresar tus dudas, sugerencias o comentarios a través de la página de contacto o aquí en la misma entrada.

¡No te pierdas ninguna publicación!

Suscríbete a La Taberna de Julio y recibirás todas las actualizaciones directamente en tu correo. Cero SPAM, lo prometo :)