Mostrar tags o etiquetas en una plantilla de Tumblr

El uso de etiquetas o tags en las redes sociales se ha convertido en un elemento imprescindible para conseguir alcanzar una mayor difusión de la publicación que hagamos, ya que permite a los usuarios encontrarla dentro de la temática que le hayamos asignado. Pero cuando hablamos de un blog esto cobra vital relevancia para organizar también nuestro contenido mediante categorías. Y es que Tumblr tiene la peculiaridad de pertenecer a esos dos mundos a la vez, pues es un sistema de microblogging y a su vez una red social.

A diferencia de otras plataformas, Tumblr nos permite personalizar la apariencia de nuestra página, bien usando alguna de las cientos de plantillas existentes, bien creando la nuestra propia. Sin embargo, las plantillas existentes no siempre muestran las etiquetas que hemos usado en nuestras entradas y a veces es muy útil que estén presentes para el visitante. Nosotros vamos a ver un método para incluir el sistema de tags que nos servirá para cualquiera de las opciones con las que estemos trabajando.

Lo primero que tenemos que hacer es ir al panel de edición del tema que estemos usando actualmente, al que podremos acceder de dos formas diferentes. La primera es entrando directamente en nuestra página y pulsando el botón ‘Editar tema‘ que habitualmente aparece en la esquina superior derecha. La segunda opción es yendo al apartado de configuración de nuestra cuenta y seleccionando el blog que queremos editar en la columna derecha (si tenemos más de uno aparecerán aquí), dentro de sus opciones encontraremos de nuevo el botón ‘Editar tema‘.

Una vez dentro del panel, encontrarás diversas opciones en el menú lateral que ya habrás visto al instalar y configurar la plantilla. Lo que haremos a continuación será modificar el código fuente del tema, de modo que pulsaremos el botón ‘Editar HTML‘ que aparece en la parte superior. Se nos abrirá el panel de edición con la estructura del blog y ahora buscaremos la zona donde se encuentra el bloque que muestra las entradas, éste estará delimitado entre las etiquetas {block:Posts} y {/block:Posts}, de modo que podremos buscar el lugar que más nos convenga dentro de ellas para mostrar nuestros tags.

Cuando tengamos claro en qué parte queremos que aparezcan, usaremos el siguiente script y tras pulsar en la vista previa, se nos permitirá guardar los cambios. Es importante que primero hagas una copia de tu tema actual si no estás acostumbrado a realizar modificaciones a este nivel, ya que puedes eliminar cosas o sobrescribirlas sin darte cuenta.

{block:HasTags}             
<span class="tags">
    <p>
    {block:Tags}
        <a href="{TagURL}">{Tag}</a>
    {/block:Tags}
    </p>
</span>
{/block:HasTags}

El código anterior lo que hace es añadir la función propia que usa Tumblr para imprimir las etiquetas. Primero comprobamos si la entrada tiene tags y en caso afirmativo las mostramos con el diseño y maquetación que queramos darle, esta parte la podremos personalizar a nuestro gusto usando HTML y CSS.