Wednesday, June 15, 2011

Agregar una descripci?n a las etiquetas del blog

En algunas ocasiones es necesario ser lo m?s descriptivo posible con ciertas ?reas del blog como por ejemplo en las p?ginas de etiquetas; ya sea porque quiz? la etiqueta que elegimos no dice mucho sobre la tem?tica de la que se habla, o porque el p?blico al que est? dirigido el blog necesita m?s detalles para su comprensi?n.
As? que una forma de ser m?s expl?citos es agregar una descripci?n en las p?ginas de las etiquetas para cuando el lector haga click en esa etiqueta pueda tener una introducci?n sobre lo que encontrar? en esa categor?a.

Como tambi�n soy malo describiendo las cosas mejor mira en este blog de pruebas que enlaza a la etiqueta Juegos. Si das click en otras etiquetas ver?s que la descripci?n cambia y ninguna de ellas se ven ni en la portada ni en las entradas individuales.




Para agregar estas descripciones a las p?ginas de etiquetas haremos uso de los c?digos condicionales para que -redundantemente- condicionemos que s?lo se muestren en la etiqueta que especifiquemos, por lo tanto puedes hacerlo para todas las etiquetas de tu blog o s?lo para las que elijas.

Primero ingresa a Dise?o | Edici?n de HTML, marca la casilla Expandir plantillas de artilugios y busca esta l?nea:
<b:include data='top' name='status-message'/>
Si no la tienes probablemente la eliminaste para ocultar el mensaje "Mostrando entradas con la etiqueta..."
Si ese es tu caso entonces busca este c?digo:
<!-- posts -->
<div class='blog-posts hfeed'>
Debajo de cualquier de esos c?digos agrega esto:
<b:if cond='data:blog.url == &quot;http://nombre-de-mi-blog.blogspot.com/search/label/Nombre-de-la-etiqueta&quot;'>
<div id='IntroEtiquetas'>
<img src='URL de la imagen' style='float: left; border:0; margin: 0 5px 10px 0;'/>
...Aqu? va la descripci?n de la etiqueta...
</div>
</b:if>
Escribe el nombre de tu blog y el de la etiqueta donde se indica. Si lo deseas tambi�n puedes agregar una imagen, pero si no, puedes quitar el c?digo de la imagen y no pasa nada.
Ese c?digo es para una sola etiqueta, si deseas m?s s?lo agrega debajo de �l otro c?digo igual cambiando obviamente el nombre de la etiqueta y su descripci?n.

Ya que hayas hecho eso a?ade antes de ]]></b:skin> los estilos:
#IntroEtiquetas {
background:#6E6E6E; /* Color de fondo */
color:#000; /* Color del texto */
padding:20px;
}
Son estilos muy b?sicos pero que puedes mejorar agregando m?s o modificando los existentes para que se adapten a tu gusto.

Como ves es un procedimiento muy simple que puede ayudar a ilustrar las categor?as de tu blog haci�ndolas m?s personalizadas.

No comments:

Post a Comment