Cambiar el favicon en blogger

¿ No has creado tu favicon ?

El favicon, o icono de página, es la pequeña imagen gráfica que los navegadores muestran en la pestaña y  en la barra de direcciones cuando visitamos una página. También es visible en las listas de blog que se muestran en las columnas laterales. Su nombre viene de la contracción de las palabras inglesas favorite icon (icono de favoritos).

  Blogger muestra por defecto una B sobre fondo naranja; inicialmente la forma de cambiarla era  añadiendo a nuestra plantilla unas líneas en HTML.

Desde hace algún tiempo Blogger en borrador - http://draft.blogger.com – la versión de Blogger donde se prueban las nuevas funciones antes de su publicación, ofrecía  la posibilidad de editar el favicon y sustituir la imagen original de forma fácil y rápida. Ahora la versión estándar de  Blogger ha incorporado esta opción.

Los pasos son muy sencillos, simplemente tenemos que seleccionar la imagen que queremos utilizar para identificar nuestro blog. En mi caso el logotipo clásico de  Bultaco. Como la imagen resultante –el favicon- será  muy pequeña  conviene que no tenga grandes florituras; vamos que una panorámica del Bernabéu no sirve.

Seguramente estará en formato .jpg o .gif. Tenemos que cambiar el formato y el tamaño al adecuado para Blogger. Necesitamos un icono con tamaño de 16 x 16.

Una opción sencilla es utilizar Genfavicon -http://www.genfavicon.com/es/- un servicio Web que permite la generación de iconos y favicon online, …y gratis.

Detalle de la página Genfavicon

En 4 pasos tenemos nuestro favicon personalizado:

1.- Pulsamos el botón Examinar y seleccionamos en nuestro equipo la imagen elegida.

2.- Pinchamos en el botón Subir Imagen

3.- Seleccionamos el tamaño 16 x 16 y pinchamos en Captura & Previsualización. Vemos el aspecto de la imagen seleccionada. 

Utilizando los puntos de arrastre establecemos el tamaño del área a capturar.

Cada cambio de tamaño o posición del área sombreada ira seguido de la pulsación del botón Captura & Previsualización, así vemos, en el recuadro azul, el aspecto de la imagen que vamos a obtener.

4.- Pinchamos en descargar favicon, seleccionamos la opción guardar, para almacenarlo en nuestro PC, y ya tenemos nuestro archivo .ico listo para subir al blog.  Su tamaño: 2 KB.

Solo queda conectarnos a Blogger con nuestra cuenta. Seleccionamos la pestaña Diseño y la opción Elementos de la página.

En la parte superior izquierda de nuestra página vemos la opción Favicon Editar.

Se abre la ventana Configurar favicon, donde utilizamos el botón examinar para indicar la ubicación en nuestro PC del archivo .ico que generamos con Genfavicon y una vez seleccionado, pulsamos en Guardar.

Solo nos queda guardar el nuevo diseño de página y acceder a nuestro blog par ver el resultado final en el navegador.

Si cambiamos el favicon varias veces seguidas, tal vez no se refleje la modificación de forma inmediata. La página estará cacheada en nuestro Pc y hay que eliminar los archivos temporales para forzar la carga de la página completa desde el servidor.

Ligero, pero significativo,  cambio de imagen en 5 minutos.