Cambiar icono de blog (1ª forma)

Cambia el icono de tu Blog (Blogger) 





Hoy vamos a aprender a cambiar el Icono que viene predeterminado en la cabecera de nuestro blog en blogger:
Lo que debemos hacer es lo siguiente: 


1- Lo primero que haremos será crear el ícono. 
Para ello, elegimos la imagen que utilizaremos. En mi caso yo elegí esta: 

La guardamos, y la dejamos a mano para utilizarla. 

2- Ahora, para crear el icono partiendo de esta imagen, vamos a utilizar una herramienta online llamada FavIcon from pics (Click para ingresar a su Web). Una vez dentro, nos encontraremos con este recuadro: 

Damos click en Examinar, seleccionamos nuestra imagen y clickeamos en donde dice Generate FavIcon.ico 


Una vez hecho esto, nuestro icono estará creado. Podemos ver como FavIcon from pics nos muestra una vista previa de como quedará en nuestro blog: 

3- Lo siguiente que haremos será guardarlo. Para ello damos click en la opción Download FavIcon Package 


Nos guardará un archivo .rar, el cual descomprimiremos. Y ahi nos aparecerá nuestro icono, llamado favicon.ico  (No hay problema si desean modificarle el nombre, siempre y cuando se deje al final el .ico) 


4- Ahora que ya tenemos nuestro icono a mano, debemos alojarlo en un servidor de imágenes que acepte el formato .ico, para esto recomiendo IconJ (Click para ingresar a su Web). 
Lo bueno de este servidor es que no necesita registro para alojar nuestra imagen. 
Al ingresar nos encontraremos con esto: 

Damos click en Examinar, seleccionamos nuestro icono y pulsamos en Upload It! 
Tras esto, nuestro icono ya estará alojado: 

5- Ahora nos dirigimos a la parte inferior de este recuadro y copiamos la dirección del icono. 
Desde donde dice href=" hasta la siguente " , Como se muestra en la siguiente imagen: 

A esta dirección la abrimos en otra pestaña. 
Bien, Ya tenemos nuestra imagen convertida a formato .ico y alojado en un servidor de imágenes. Ahora se viene la parte de Blogger. 


6- Ingresamos a nuestra cuenta de Blogger, vamos a Diseño, Edición HTML y buscamos el siguiente código: 


"  <title><data:blog.pageTitle/></title>  "


Y ANTES de este código pegamos lo siguiente: 


"  <link href='http://sitio.com/favicon.ico' rel='shortcut icon' "
type='image/x-icon'/> 


Cambiamos http://sitio.com/favicon.ico por el link de nuestro icono y luego guardamos la plantilla. 


Y listo!, Ya tenemos nuestro propio icono en nuestro blog.