Los íconos tienen dos funciones, que el usuario identifique visualmente un elemento y estética (en este caso estética en nuestro blog). Un ejemplo es el ícono de estrella que aparece en los Temas de la Ciudad. Para añadir un ícono a nuestras etiquetas (labels) hacemos lo siguiente:
Lo que está en verde lo pueden cambiar por la URL del ícono que ustedes quieran, yo les he dado este folder de ejemplo
- Vamos a Diseño > Edición de HTML y marcamos Expandir artilugios.
- Buscamos la etiqueta
<a expr:dir='data:blog.languageDirection' expr:href='data:label.url'>
- Justo después de ella pegamos lo siguiente:
<img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhI595k3NUGLs-LP46FXeQLRtHgMJqtAae5CeCG4-eBbQLp400dnRlxC9Az7AMVh3UfL9T9hxUvREyZ0lb14RPSCs1Uu2MZKNrKRvRIkoniuHqQr75KkkG2VApC4vixTRMdcCjlIbr2bxV8/'/>
- Guardamos los cambios y listo.
Lo que está en verde lo pueden cambiar por la URL del ícono que ustedes quieran, yo les he dado este folder de ejemplo
Ciudad Blogger
Sabes, no me salio nada,
ResponderEliminarO soy muy mala, o no te entendí, si puedes me ayudas.-
Anne
Hola Anne,
ResponderEliminarNo sé de qué modo puedo ponerlo más claro. Si me das unas horas haré otro post con un método más sencillo.
Saludos.
Si Funcionó muy bien, gracias buen aporte, probe en muchos lugares pero este es el unico que funciono, me refiero a los codigos, te agradezco!!
ResponderEliminarHola antonio Blog,
ResponderEliminarMe da gusto que hayas encontrado aquí la solución.
Un saludo.
Hola, desde ya gracias, pero no me andubo.. quise hacerlo con los archobos y no me salio.. me podrias decir como?
ResponderEliminarYa esta, ya solucione mi problema..
ResponderEliminarGracias, mui buen blog
Hola jPxX,
ResponderEliminarTe me adelantaste =P
Qué bueno que ya pudiste solucionarlo.
Saludos y gracias por tu visita.
hola sabes que tengo mi blogger pero en la parte superior q8uiero cambiarle el encabezado y no puedo me puedes ayudar!!!
ResponderEliminarHola ANGELINA,
ResponderEliminar¿En cuál de tus blogs?
POTRO ME PUEDES DECIR DONDE CONSEGUIR MAS ICONOS
ResponderEliminarE BUSCADO POR TODO GOOGLE IMAGENES Y NADA
BUENO
¡SALU2!
Hola Panfu_Canesi,
ResponderEliminarEn el siguiente enlace, al final del post encontrarás un enlace de descarga de 1000 íconos, ojalá alguno te sea útil:
http://ciudadblogger.com/2009/07/decora-los-titulos-de-los-post-con.html
Saludos.
potro mira en mi cabecera de mi blog
ResponderEliminarme aparece con borde
ayudame porfa
http://blogiablogger.blogspot.com
ayudame porfavor.
Hola Blogio,
ResponderEliminarYa te he respondido en esta entrada:
http://ciudadblogger.com/2009/07/decora-los-titulos-de-los-post-con.html
y como escojo para cada etiqueta un icono diferente?
ResponderEliminarNo es posible, pero podrías hacerlo dentro de un elemento HTML/Javascript, ahí pon las URLs de tus etiquetas y así de esa forma puedas ponerles por separado un icono diferente.
ResponderEliminarHola Potro ¡gracias! Saliò perfecto este truco,una pregunta: ¿como podrìa agrandar el tamaño de letra de este gadget?
ResponderEliminarSaludos.
Hola Mariangeles,
ResponderEliminarSólo agrega antes de ]]></b:skin> esto:
#Label1 {
font-size:18px;
}
Ahí puedes cambiar ese 18px por otro tamaño más grande según sea tu gusto.
Saludos.
Hecho Potro, Graciasss!!!
ResponderEliminarQue tengas un buen dìa
Saludos!
Hola Potro,
ResponderEliminarEspero te encuentres bien. Queria hacerte una pregunta¿ como hago para cambiar de color es texto del gadget de etiquetas? ,o sea los nombres de las etiquetas?sin que cambien el color del texto de todos los gadgets( solo el de etiquetas, igual que le cambiamos el tamaño, pero ahora el color ,se puede?
Saludos.
Hola Mariangeles,
ResponderEliminarAsí como lo estabas haciendo está bien, sólo que has colocado los códigos encima de otros códigos. Lo tienes de este modo:
.Header {
text-align: center;
#Label1 h2 {
background:left top;
color: #FF0000;
}
.comment-timestamp {
display: none;
visibility: hiden;
}
#Attribution1 {display:none; visibility:hidden;}
}
Si te fijas tienes mal cerrada la llave } que hace que dé validez a los estilos aplicados. es decir, debía estar después de:
.Header {
text-align: center;
Y lo has colocado hasta al final del código que te he mostrado. Todo eso debe quedar así:
.Header {
text-align: center;
}
#Label1 h2 {
background:left top;
color: #FF0000 !important;
}
.comment-timestamp {
display: none;
visibility: hiden;
}
#Attribution1 {display:none; visibility:hidden;}
Saludos.
Hola potro hace dias vi una entrada acerca de poner las etiquetas tipo menu o algo asi, parecido al que tu tienes, pero ya no la encuentro podrias decirme donde esta o que cosas puedo hacer para personalizar las etiquetas, recuerdo que en la entrada tenia que bajar algun programa mas o menos.. gracias por tu ayuda
ResponderEliminarNo creo que haya alguno donde se tenga que descargar un programa, supongo que te refieres al menú de categorías.
ResponderEliminarSino mira la sección Menús para ver si está ahí lo que buscas.
Potro esa entrada no es, no quiero un menu;lo que quiero mas o menos es que las etiquetas esten mas personalizadas que parescan un indice pero mucho mas agradable, recuerdo haber visto una entrada en la que mencionabas algo parecido y si habia que descargar algo, por favor si me puedes dejar las entradas que mas se parescan a esto te lo agradecere mucho.
ResponderEliminarNo recuerdo, pero utiliza el buscador, seguro ahí tendrás más suerte si pones algunas palabras que recuerdes que tiene la entrada.
ResponderEliminaresto pone pero en todas las equietas de la etiqueta
ResponderEliminarahi alguna forma de colcoar un icono distinto a las etiqueta que yo quiera
me explico bien?
Te explicas bien, pero con el gadget de etiquetas no se puede. Lo que se hace en esos casos es crear un gadget HTML/Javascript y ahí agregar manualmente el código del icono así como la URL de la etiqueta:
ResponderEliminar<img src="URL del icono" /> <a href="URL de la etiqueta">Nombre de la etiqueta</a>
Eso se agrega por cada etiqueta que quieras mostrar en tu gadget.
Hola, soy nueva en esto del blog y tus explicaciones me están resultando super útiles. Un millón de gracias.
EliminarEn relación a esto que comentas para poner un icono únicamente en una de las etiquetas... dónde tengo que agregar lo que indicas??? Ya sé que en lo de HTML pero después o antes de qué???
Gracias de antemano
Hola gogo,
EliminarEn el caso de es ejemplo que he puesto, tienes que crear un elemento HTML/Javascript, ahí poner manualmente el enlace a las etiquetas. Es decir, usar esta línea por cada etiqueta que tengas:
<a href="URL de la etiqueta">Nombre de la etiqueta</a>
Y con la que quieras ponerle un ícono usa este código:
<img src="URL del icono" /> <a href="URL de la etiqueta">Nombre de la etiqueta</a>
Saludos.
potro y para poner icono a enlaces como por ejemplo donde tu tienes que dice blogs de ayuda para poner iconos asi a enlaces, NO A ETIQUETAS.
ResponderEliminarMira esta entrada:
ResponderEliminarhttp://ciudadblogger.com/2009/06/poner-iconos-en-etiquetas-y-otros.html
Hola Potro,
ResponderEliminarComo estas?.
Tengo una preguntita: He colocado una etiqueta en mayusculas a una nueva entrada. Es posible cambiar la etiqueta a minusculas?>
He estado tocando y tocando el paner de control, pero no parece que no me deja...
Muchas gracias,
Tu seguidor fiel,
Jose
Hola Jose,
ResponderEliminarEntra a Creación de entradas > Editar entradas. Ahí selecciona con las casillas las entradas a las que les quieres cambiar la etiqueta. Ya seleccionada verás arriba un menú desplegable que dice 'Acciones de etiquetas...' Da click ahí y debajo de 'Eliminar etiqueta' selecciona la etiqueta que ya no quieres. Eso le eliminará la etiqueta, ahora ahí mismo da click de nuevo a ese menú y debajo de 'Aplicar etiqueta' selecciona 'Nueva etiqueta...'
Ahí escribe la etiqueta tal como la quieres.
Saludos.
Hola Potro..
ResponderEliminarEres grande, genio y fuera de serie!..
Me ha salido y lo he podido cambiar..
En ese momento pegue un grito de alegria..
Pense por un momento que ya no podia modificarlo.
Muchisimas gracias por tu valiosa informacion.
Tu seguidor fiel,
Jose
Hola sigo los pasos que pones pero no me sale nada
ResponderEliminarPrueba entonces con este otro método:
ResponderEliminarhttp://ciudadblogger.com/2009/06/poner-iconos-en-etiquetas-y-otros.html
Hola otra vez cuando pongo a buscar la parte de arriba que tu indicas no me sale en mi plantilla blogger lo curioso es que mi plantilla es original de blogger
ResponderEliminarUsa las teclas CTRL+F para encontrar los códigos de forma más fácil. Con el método de esta entrada recuerda que debes expandir los artilugios. Con el segundo sólo tienes que reconocer la ID del gadget al que le quieres poner los íconos.
ResponderEliminarHola potro, sabes como especificar la cantidad de entradas en un enlace a etiqueta?
ResponderEliminarHola Sirius,
ResponderEliminarSólo si es en el mismo gadget de Etiquetas, al editarlo te da la opción de mostrar el número de entradas que tiene cada etiqueta. Pero eso es sólo dentro del gadget de Etiquetas.
a bueno gracias :)
ResponderEliminarhey potro como en ves de que sea un icono pongo una imagen que represente la etiqueta
ResponderEliminarpor ejemplo una etiqueta que diga
musica
y que en ves de que aparesca la etiqueta aparesca una imagen con el mismo nombre de musica y que se dirija a la etiqueta
nose si me entiendas
Sí puedes hacerlo pero no con este método.
ResponderEliminarSólo tendrías que poner en un gadget HTML/Javascript un código como este por cada etiqueta que tengas:
<a href="URL de la etiqueta"><img src="URL de la imagen" /></a>
Ahí sólo cambias la URL de la imagen que quieres, y la URL de la etiqueta.
¿Se puede poner un ícono a los títulos de las entradas?
ResponderEliminar=3
Sí, en esta entrada se explica cómo:
ResponderEliminarhttp://ciudadblogger.com/2009/07/decora-los-titulos-de-los-post-con.html
Hola Potro,
ResponderEliminarte planteo una duda aquí aunque no tiene que ver directamente con esta entrada:
-he cambiado el fondo de los gadgets de la sidebar en mi blog entrando en Diseñador de plantillas / avanzado. Se cambia el fondo de todos los gadgets al color elegido.¿Es posible coger un gadegt -en mi caso el de etiquetas- y personalizar sólo su fondo, de manera que el resto de gadgets mantengan el color que he cambiado en bloque en el diseñador de plantillas?
Me gustaría poder personalizarle tanto el fondo como el color de los enlaces/enlaces visitados/color al situar el cursor.
¿Cómo se haría?
Gracias por tu ayuda.
Hola Potro,
ResponderEliminarhe olvidado dejarte la dirección por si ayuda observar el blog:
www.efcondearanda.blogspot.com
GRACIAS
Hola jorge,
ResponderEliminarEs el mismo método, sólo tienes que conseguir el ID del gadget que quieres modificar y poner los estilos adecuados:
#ID {
background:#FF00FF;
}
Eso hará que sólo ese gadget cambie su color de fondo.
Saludos.
Pregunta: ya puse el ícono a las etiquetas, hasta ahí todo bien, quedó un poco mejor, pero el título "Mis artículos" que en realidad son la lista de etiquetas, quedó pegado hacia la izquierda y lo quiero centrado...igual que el de Mis enlaces, se puede hacer eso? gracias.
ResponderEliminarPuedes centrar todos los títulos de los gadgets de una vez, para ello añade debajo de h2 { esto:
ResponderEliminartext-align:center;
Saludos.
Gracias por el aporte!
ResponderEliminari like!
Funciono!!!!
gracias
Potro una pregunta, si en vez de poner una imagen quiero poner un simbolo... como por ejemplo este ">" (sin las comillas) como deberia hacer para aplicarlo?. Reemplazo la imagen por ese signo/simbolo
ResponderEliminarCon este método no se puede, pero con este sí:
Eliminarhttp://ciudadblogger.com/2009/06/poner-iconos-en-etiquetas-y-otros.html
Pero, en ese caso tendrías que usar el atributo content, por ejemplo:
li:before {
content: ">";
padding-right:7px;
}