Cambiar Favicon a Blogger

24 abr. 2011

Cambiar Favicon a Blogger


Favicon, mas conocido como el icono de la pagina, es una pequeña imagen que aparece en la barra de direcciones o en las pestañas al abrir un sitio web y puede ser usado para crear recordación entre los usuarios. En este tutorial muestro como cambiar el favicon de tu blog (que por defecto aparece como el logo de blogger).

En la siguiente imagen se ve como aparece el favicon de aquiselastecno antes del proceso:


Lo primero que se debe hacer es crear la imagen, esta debe ser preferiblemente de 16x16, formato .ico y elaborada con paleta de 16 colores. Una buena herramienta para hacer dicho icono es Gimp, pero también puedes hacer uso de servicios web como http://www.favicon.cc/ (usado en este tutorial) que te permite dibujar el favicon o como FavIcon from Pics que te permite subir una imagen de cualquier dimensión y te genera dicho icono.



Una vez tengas la imagen debes subirla a un hosting, si eres usuario de blogger seguramente tienes cuenta en PicasaWeb así que puedes subirla dando clic en "add photos" dentro del album del blog o puedes usar este servicio especialmente diseñado para favicon http://www.iconj.com/ (la imagen siguiente corresponde a esta pagina). IconJ te sugiere que código debes pegar en el html de nuestro blog. Lo mas importante es obtener la URL del icono.


Ahora abres tu cuenta de blogger y das clic en "Diseño", luego en "Edicion de HTML"


Agregar la siguiente linea antes de la etiqueta </head> (usa Ctrl+J para encontrarla facilmente).

<link href='URL_de_nuestro_icono' rel='shortcut icon' type='image/x-icon'/>
Por ejemplo para mi caso:
<link href='http://www.iconj.com/ico/f/7/f7rras5hty.ico' rel='shortcut icon' type='image/x-icon'/>



Guardas los cambios. Eso es todo, el resultado es el siguiente:


Aunque lo hice para blogger, este tutorial puede ser aplicado a cualquier pagina si puedes modificar el html de esta. Simplemente necesitas agregar la etiqueta <link> como se mostró en esta entrada.

1 comentario :

  1. Ahora se puede cambiar directamente desde el diseñador gráfico de blogger

    ResponderEliminar