El favicon es un archivo gráfico con extensión .ico y normalmente de tamaño 16x16 pixeles. Precisamente en esto radica la "complejidad", ya que es un formato poco habitual. De lo que normalmente disponemos son de archivos jpg, gif o png pero no un archivo .ico.
Paso 1. Generar el archivo favicon.ico a partir de una imagen
Paso 2. Personalizar el favicon del blog
- Conecta con el servicio GenFaicon
- Selecciona la imagen de partida (jpg, gif, png) y presiona Upload.
- Indica el tamaño. 16x16 y presiona Capturar y previsualizar, fíjate que puedes mover la zona a capturar de tu imagen original.
- Una vez lo tengas, presiona Descargar el favicon, guárdalo en un lugar que luego sea fácil encontrarlo. Debe llamarse favicon.ico
Procedimiento actualizado el 08/06/2011
Paso 2. Personalizar el favicon del blog
- Debes entrar a blogger pero a través de esta dirección http://draft.blogger.com (versión más avanzada de blogger)
- Abre la pestaña "Diseño" y luego "Elementos de la página"
- En la parte superior izquierda verás una zona llamada "Favicon" (nueva opción de blogger publicada el 8 de Junio de 2011)
 |
| Nueva funcionalidad para cambiar el Favicon en Elementos de la Página de Blogger |
- Pulsa "Editar". Se abre una nueva ventana donde tienes un botón para "Examinar"
- Busca el icono generado en la paso 1 y pulsa "Abrir" y posteriormente "Guardar"
- Guarda la plantilla y visualiza el blog.
Nota: Si vez que no se muestra tu nuevo icono, usa la opción de eliminar de tu navegador el caché, cookies y demás y vuelve a visualizar el blog. El nuevo icono se localizará automáticamente en el raiz de la dirección del blog, ejemplo www.iniciablog.com/favicon.ico
Con este nuevo procedimiento ya no es necesario publicar el favicon en un hosting ni personalizar el código de la plantilla. Queda también resuelto el problema de incompatibilidad que se presentaba con Internet Explorer 9 donde no se veía el favicon personalizado de blogger y que fue reportado por uno de nuestros seguidores. Si quieres ver el método utilizado anteriormente haz clic aquí (PDF)
Como en cada entrada, te invito a usar los comentarios para dejar tu opinión, además si te ha gustado, una forma de ayudar a que iniciaBlog lo conozca más gente es haciendo clic en los botones de Twitter y Facebook. ¡Gracias!
Con este nuevo procedimiento ya no es necesario publicar el favicon en un hosting ni personalizar el código de la plantilla. Queda también resuelto el problema de incompatibilidad que se presentaba con Internet Explorer 9 donde no se veía el favicon personalizado de blogger y que fue reportado por uno de nuestros seguidores. Si quieres ver el método utilizado anteriormente haz clic aquí (PDF)
Como en cada entrada, te invito a usar los comentarios para dejar tu opinión, además si te ha gustado, una forma de ayudar a que iniciaBlog lo conozca más gente es haciendo clic en los botones de Twitter y Facebook. ¡Gracias!
Entradas
no funciona.
ResponderEliminarEn Internet explorer sale el mismo de Blogger porque el favico se encuentra en el directorio raiz. Alguien saber como cambiarlo?
Si no te funciona es posible que el navegador tenga en caché el icono antiguo. Elimina el caché del navegador desde el menú herramientas y debe verlo. Si ves que sigue sin funcionar envíame un enlace hasta tu blog para verificarlo.
ResponderEliminarSeguimos en contacto.
Hola, segui todos tus pasos, muy bien explicados por cierto, y...tachán!! Funciona!
ResponderEliminarMuchas grácias y enhorabuena por tú blog.
No te perderé de vista ;)
Gracias por tu comentario y por seguirme, si quieres déjame tu dirección del blog y puedo recomendarte algunas entradas de iniciaBlog para que las puedas poner en práctica o bien consulta todo el índice de los temas ya publicados. :D
ResponderEliminarAh si? grácias muy amable.Mi blog es lanimuu.blogspot.com, tengo muy poco contenido todavía jeje.
ResponderEliminarHola, mi favicon siempre se ha visualizado, pero hace varios dias, que fue que me percate, no se visualiza. He investigado en la red y parece que hay algun tema de incompatibilidad entre blogger y IE9. Lo cierto es que he realizado todos los cambios que recomiendan y nada, sigue saliendo el dichoso favicon de blogger. Sabes algo al respecto? He abierto muchos blog, y en unos se muestran y en otros no, como el tuyo que tampoco se visualiza en mi IE9. En otros navegadores OK. Muchas gracias.
ResponderEliminarHola Daycareweb,
ResponderEliminarLlevas toda la razón. La pista de lo que está pasando con blogger e internet explorer 9 puedes verla por aquí.
http://answers.microsoft.com/es-es/ie/forum/ie9-windows_7/no-se-visualizan-los-favicon-en-blogger-desde-ayer/53461044-d5ca-4233-8459-cae6e57aa643
Ya te comentaré algo más concreto y si es necesario actualizaremos este post.
Saludos y gracias por tu comentario
Muchas gracias por tu pronta respuesta, ese post ya me lo he leido varias veces pensando que yo no lo hacia bien, pero no, lo he hecho varias veces, todo, y nada. Tu favicon tampoco sale, como te dije. Saludos
ResponderEliminarEfectivamente se ve que es un problema reciente. Todo apunta a incombatibilidad del ie9 con blogger...he visto ya varios foros pero no hay repuesta oficial. Confirmarte que con ie8 va bien.
ResponderEliminarDéjame indagar un poco y te informo.
Gracias.
Correcto, con el IE8 va bien.
ResponderEliminarGracias.
Hola Daycareweb.
ResponderEliminarComentarte que Google acaba de sacar una nueva funcionalidad mediante la cual ahora es posible personalizar directamente el icono sin necesidad de tener que usar un servicio extra para alojarlo.
Ve a Diseño-->Elementos de la página y vas a ver un nuevo elemento en el diseño llamado Favicon. Haz clic para publicar un icono personalizado. Una vez lo tengas borra cache y dale un tiempo veras el nuevo icono incluso en internet explorer 9. Comentame....
Acabo de actualizar esta entrada con el nuevo procedimiento para personalizar el favicon del blog. Además lo he probado con Internet Explorer 9 de manera satisfactoria.
ResponderEliminarGracias por tu empeño.
ResponderEliminarEn mi blogger no aparece esa nueva funcionalidad, te confirmo que la he buscado, incluso en otras pestañas, pero no la tengo. No se porque.
Saludos.
Debes entrar a blogger a través de esta dirección http://draft.blogger.com es una versión más avanzada donde incorpora funcionalidad que con el tiempo llega a la versión "normal"
ResponderEliminarMuchas gracias, finalmente funcionó.
ResponderEliminarIntuyo, que los codigos anteriores ya no son necesarios, cierto?
Saludos y muchas gracias.
Efectivamente. En principio he quitado del head lo anterior y me funciona y como habrás podido leer he cambiado todo le procedimiento con respecto a lo que había antes. Si quiere consultar el procedimiento anterior tienes un enlace a un archivo PDF.
ResponderEliminarPerfecto! Dayvareweb. Gracias
Hola, lo que te cuento es de pelicula.
ResponderEliminarEn casa tengo 2 PC, los dos con IE9.
En uno funcionó como te dije y en el otro no. Parece que mi IE9 esta tonteando. Incluso tampoco veo el icono tuyo. En el otro OK.
Ya he borrado cache y reeiniciado, 2 veces, pero nada.
Saludos
Gracias, menos mal, antes habia que tocar el código para poder cambiar el favicon.
ResponderEliminarmuchas gracias me a servido mucho :)
ResponderEliminarmi blog:http://www.southparklatino.com.mx/
Gracias David,
ResponderEliminarMe gusta tu blog y he visto el nuevo icono....
Seguimos en contacto
Hola, mira yo tuve un error y era que me salia que el archivo era invalido y era .ico pero se me habia olvidado que habia modificado el html para que apareciera
ResponderEliminarhref='http://www.fileden.com/files/2010/5/14/2859210/favicon.ico' rel='shortcut icon' type='image/x-icon'/>
solo elimine el codigo de mi plantilla y pude poner directamente desde blogger, espero que alguien que le pase lo mismo le sirva esta solucion
Gracias Fabix es sumamente interesante tu aporte...gracias por dejar tu comentario seguro que resultará muy muy útil..
ResponderEliminarDisculpa no haberte respondido antes pero se me había pasado tu comentario.
Gracias, Jesús.
Efectivamente Merovingio, antes habia que modificar la plantilla y además buscarte la vida para hostear el icono, parece mentira como algo "tan sencillo" no estuviese de antes...pero bueno.
ResponderEliminarGracias por tu comentario.
Hola Jesús, éxito en este Año que Inicia. Tengo un problemilla y no es precisamente con el icono del favicon si no con la dirección (URL) de mi blog esta no aparece cuando lo agrego a mi favoritos.
ResponderEliminarNi tampoco aparece en la pestaña que despliega o abre firefox y IE. Solo aparece el icono del favicon con un punto al lado. Me podrías echarme una mano, esta es la dirección del blog (cursodecadd2d.blosgpot.com) saludos.
Nota: Esto solo ocurre cuando intento agregar a favorito la página de inicio del blog.
Hola Robert,
ResponderEliminarHe podido conectar con tu blog y lo primero es tratar de solucionar el tema del nombre del blog ya que aparece un punto.
Para ello ve a la pestaña Configuracion-->Básico y donde pone título pulsa Editar para ponerlo.
Avísame nuevamente cuando lo tengas para mirar el resto!
Gracias y feliz 2012 para ti también!
Jesús González
Listo Jesús solucionado el problema por fin mil gracias saludos.
ResponderEliminarGracias Rober por comentar
Eliminaryo le puse uno pero quiero reemplazarlo... ya borre los cokies y no me sale que puedo hacer???
ResponderEliminarDime cual es la direccion de tu blog
Eliminardisculpen mi ignorancia pero recién estoy intentando aprender este tema de los blogs y aún no sé por mucho q he buscado información.....q es un favicon y para q sirve????
ResponderEliminarJeje..Pepa...se trata del iconito que adquiere la pestaña dentro del navegador web. Por defecto tienes el icono naranja típico de blogger, pero éste puede personalizarse tal y como se describe en este post.
EliminarUn saludo..ah! y gracias por este comentario
Jesús González.
Hola Jesus.
ResponderEliminarHe probado lo que me dices. tengo un icono de 16X16 con formato .ico, desde http://www.iconfinder.com/icondetails/64759/16/. El tema es que no puedo lograr que se vea en Internet Explorer. Me gustaría que observaras mi blog:
http://mbexcel.blogspot.com/
Solo he logrado que se vea el nuevo favicon en la opción de favoritos.
Gracias por tu ayuda
Hola Mauricio,
EliminarLo veo perfectamente lo he probado con Chrome, Firefox y con Internet Explorer y en los tres casos visualizo el Favicon sin problemas. Si ves que siges con el problema elimina las cookies y los archivos temporales del navegador y vuelve a probar.
Aprovecho para felicitarte por tu blog, me ha parecido de los más interesante.
Ya me dices algo ¿vale?
Un abrazo,
Jesús González
Gracias Jesus por tu comentario. En cuanto al tema en cuestión, me gustaría que me indicaras como eliminar las cookies y los archivos temporales.
EliminarNo se si entiendo lo que me propones con respecto Google Docs.
Me imagino que se trata de como "colgar" las hojas de cálculo para permitir descargas?. Si tienes algo acerca de este tema me gustaría que me asesoraras.
Muchas gracias por tu pronta respuesta, y como es debido, a partir de hoy soy un nuevo seguidor de tu sitio.
Hola Mauricio,
EliminarSi usas Internet Explorer ve al menú Herramientas y luego en la pestaña General tienes un botón de Eliminar el historial. Cuando lo presiones puedes eliminar todo, incluido las cookies y archivos temporales.
Con respecto a Google Docs, considero que es la opción en la nube "en internet" más interesante que existe. Aunque la funcionalidad de la hoja de cálculo de microsoft es infinitamente superior, esta otra, la de Google resuelve muy bien una hoja de calculo con edición y almacenamiento en Internet. Te lo dije fundamentalmente para despertarte la curiosidad en este aspectos y dedicaras un análisis a esta hoja.
Te espero!
Jesus. Gracias por tu ayuda, me ha sido de gran utilidad.::
ResponderEliminarPerfecto, entiendo que has visto el icono verdad?.
EliminarHola Jesus, efectivamente ya se ve mi favicon....
ResponderEliminarGracias....
Perfecto!
EliminarGenio de la vida♥ lo logrè.
ResponderEliminarEstuve a punto de escribir diciendo qe no salia.
Mi problema fue qe borraba el cache i los cookies pero no el resto del historial..
Pero ya lo hice y enseguida quedò.. :D
Muchas gracias por los pasos excelentemente explicados :)
Un abraso.
Hola Rooh,
EliminarEfectivamente el caché del navegador puede jugar malas pasadas....perfecto!...gracias por comentar, he visto tu blog y tu flamante favicon ¡felicidades!
Un abrazo,
Jesús González
muchas gracias, me has ayudado.
ResponderEliminarSaludos.
Gracias a ti....Mucha suerte con tu blog
EliminarJesús González
Hola Jesus,
ResponderEliminarNo se que me pasa al crear mi favicon.
Subo la imagen en .jpg y después hago los pasos siguientes. Pero el favicon que se me crea no se entiende nada, las letras están totalmente deformadas y pixeladas.
¿Que me pasa?
Gracias,
María
Me parece que es muy grande la imagen...trata de recortarla, con el servicio que te propongo puedes hacerlo. Coméntame si lo logras, en caso contrario te propongo otras variantes.
EliminarMuchas gracias por acercarte hasta iniciablog.com
Jesús González
Ya lo he conseguido.
Eliminarmuchas gracias!
María
Hola, estoy presentando el mismo problema con el favicon. En el diseno sale bien, pero en la direccion http:// no hay manera!
ResponderEliminarMi direccion: www.lidislamoru.com
Gracias
he intentado de todo, hice restar a misafari, elimine cache'. cokies y nada. No puedo colocar mi icono en la url. Y estoy pagando dominio personalizado
ResponderEliminar