Poner encabezado en las etiquetas de Blogger
Junio 3rd, 2007 | Publicado por Francisco en Blogger | 16 Comentarios
La introducción de la categorización por etiquetas en Blogger, sin duda fue una gran ayuda para la clasificación de la información de nuestro Blog, aun así creo que hay detallitos que harían un poco más amigable la navegación de los usuarios, Una de ellas es tener un encabezado en las etiquetas más importantes, es decir, que si tienes una sección llamada tecnología, sobre las entradas de la página de esta etiqueta halla una leyenda como “Estas en la sección de tecnología”. Por ejemplo en nuestra sección de plantillas:
Veamos como hacerlo.
- Entra a la pestaña “Plantilla” o también llamada “Diseño” desde el escritorio y después a la opción “Edición de HTML” donde activamos la casilla “Expandir plantillas de artilugios”.
- Buscamos el siguiente código:
<b:includable id='status-message'> - Debajo de este código colocaremos cada uno de los mensajes o imagenes que usaremos como cabecera en cada etiqueta, para lo que usaremos el siguiente esquema:
<b:if cond='"http://TUBLOG.blogspot.com/direccion-de-etiqueta" == data:blog.url'> <!-- Código de cabecera aquí --> </b:if> - Ahora busca el siguiente código:
]]></b:skin> - Justo arriba pega los siguientes estilos:
/*Estilos del contenedor de cabeceras de etiquetas*/ .status-msg-wrap { width:100% !important; margin:0px !important } .status-msg-bg { background:transparent !important } .status-msg-border { border:none !important; } - Guarda y listo!
Donde http://TUBLOG.blogspot.com/direccion-de-etiqueta es la dirección de la etiqueta. Y justo bajo: <!– Código de cabecera aquí –> es el lugar correcto para poner el código de la cabecera.
Tendras que seguir este esquema de código para cada etiqueta a la que pretendas ponerle una cabecera.
Ejemplo:
Para una cabecera de texto en mi etiqueta llamada “CSS”:
<b:if cond='"http://blogyweb.blogspot.com/search/label/CSS" == data:blog.url'>
<!-- Código de cabecera aquí -->
<h2>Estas en la sección de CSS</h2>
</b:if>Para una cabecera de imagen en mi etiqueta llamada “Photoshop”:
<b:if cond='"http://blogyweb.blogspot.com/search/label/Photoshop" == data:blog.url'>
<!-- Codigo de cabecera aqui -->
<img src='http://sitio.com/direccion-de-la-imagen'/>
</b:if>Donde http://sitio.com/direccion-de-la-imagen es el sitio donde se encuentra la imagen que pretendo usar como cabecera en la etiqueta photoshop.
Puedes usar cualquiera de estas dos opciones indiferentemente y aplicarlo a todas tus etiquetas o a las que selecciones, poniendo el código justo abajo del código de la anterior.
Cualquier duda en los comentarios. Espero les sirva y no tengan problema.
Junio 3rd, 2007 a las 10:57 am (#)
hOLA! ESO ES PADRISIMO…!
PUEDES VENRIR A MI BLOG SOBRE THALIA…LA DIRECCION ES http://WWW.NUESTRATHALIA.BLOGSPOT.COM
TODO EN BLOG/SITIO ES MUY BUENO Y MUY FACIL DE HACERLO…
GRACIAS!!!
Junio 3rd, 2007 a las 6:10 pm (#)
Os copio aquí el mensaje que os acabo de dejar en el post original 8el de la plantilla para Blogger portfolio):
Por favor, se os ha agotado el ancho de banda para alojar esta imagen y justo acabo de poner yo esta plantilla en mi blog, que mola mucho por cierto, y ahora aparece desconfigurada la cabecera del blog
Podríais por favor arreglarlo, ya que la imagen está linkeada a vuestro blog directamente, y aunque he intentando encontrarla en cahé para subirla a imageshack no me deja??? Por favor, ponednos la imagen el algún sitio para que podamos cogerla desde ahí y así no tener problemas de ancho de banda. De todos modos vuestro link a vuestra página sigue estando en mi página, así que… Gracias.
Junio 3rd, 2007 a las 6:29 pm (#)
Hola!
Ekleipsis: Muy bueno tu blog, veo que no tuviste ningun problema :), gracias por tus comentarios.
Porfineslunes: AL parecer fue cosa de unas horas lo del ancho de banda y ahora esta bien, de cualquier modo, ahora que esta funcional aloja las imagenes en algun otro servidor para evitar estos problemas.
Saludos!
Junio 3rd, 2007 a las 7:50 pm (#)
Sin duda el mejor blog de ayuda, que he visto para blogger y las plantillas, magnificas, sigue asó
Junio 5th, 2007 a las 3:05 am (#)
Gracias N0xTrUm!
Saludos!
Julio 21st, 2007 a las 1:02 pm (#)
Hola, Francisco a que puede ser que al intentar guardar o ir a vista previa salga este mensaje.
No se ha podido analizar su plantilla, porque no está bien formada. Asegúrese de que todos los elementos XML se han cerrado correctamente.
Mensaje de error de XML: Element type “b:if” must be followed by either attribute specifications, “>” or “/>”.
Gracias, Walter
Julio 21st, 2007 a las 4:14 pm (#)
Hola Walter, por el tipo de error es muy probable no hallas cerrado bien una etiqueta o hallas omito alguna comilla.
Septiembre 6th, 2007 a las 9:23 pm (#)
hola que tal?
sabes en la primera instruccion dijiste que buscaramos este codigo
pero lo he buscado y no me aparece… estoy mal yo que puede ser?
alguna solucion?
salu2muy buena la pagina
Septiembre 6th, 2007 a las 9:24 pm (#)
no salio el codigo es el primero quie diste no me aparece
Septiembre 9th, 2007 a las 5:21 pm (#)
verifica tengas activado “Expandir plantillas de artilugios”
Diciembre 15th, 2007 a las 10:38 am (#)
hay alguna forma para que el menu quede de forma vertical?
Diciembre 15th, 2007 a las 10:50 am (#)
perdon entendi cualquier cosa
Marzo 22nd, 2008 a las 5:35 pm (#)
Ops…cuando voy a guardar, me aparece el siguiente error:
No se ha podido analizar su plantilla, porque no está bien formada. Asegúrese de que todos los elementos XML se han cerrado correctamente.
Mensaje de error de XML: The content of elements must consist of well-formed character data or markup.
Y no sé cómo corregir el error, podrían ayudarme?
Gracias
Marzo 22nd, 2008 a las 5:38 pm (#)
Bueno…ya lo encontré, jeje era error mío al escribir lo de código de cabecera
Marzo 22nd, 2008 a las 6:34 pm (#)
Lo único que sucede, es que al actualizar el blog, no me aparece por ningún lado las etiquetas como encabezado…
Junio 9th, 2008 a las 7:57 am (#)
Gran tutorial, pero ¿existe la forma de que lo que cambie sea la imagen de la cabecera y no la de abajo?
Sería muy de agradecer.
Un saludo