Favicon en Blogger

Si ten has tomado la molestia de tener tu propio dominio en Blogger, lo más probable es que desees ir personalizando tu blog, tómatelo con calma y no quieras hacer lo todo en un solo día, mientras esperas a que los buscadores indexen tu página tienes tiempo de ir haciendo todas esas cosas.

El favicon es una de esas cosas que te ayuda a personalizar tu página, es el iconito que sale en la barra del navegador al lado de la dirección y en las pestañas de firefox. Es uno de los sellos de identidad de tu blog, voy a explicar como lo puedes poner en tu blog de Blogger.

Primero debes de saber que el navegador de Microsoft Internet Explorer no se lleva nada bien con el favicon, en algunas versiones no se ve, en otras solo se ve si usas el formato ico, así que no me voy a tomar la molestia de explicar como ponerlo para IE por que probablemente no funcione, por eso te recomiendo que simplemente te pases a Firefox, no obstante puedes buscar sobre el favicon e IE en internet para ampliar la información.

Otra cosa que deberías saber es que existen dos versiones de Blogger la antigua y la nueva que hasta hace poco mantuvo el nombre de Blogger Beta, todo lo que voy a explicar es para la esta última versión.

Lo primero que debes hacer si quieres poner tu favicon en Blogger Beta, es pensar en que icono quieres, debe ser algo sencillo dado el tamaño de la imagen (16 x16 pixel), como es un dibujo sencillo puedes crearlo incluso con el paint de windows, después has de convertirlo con otro programa a formato jpg, por ejemplo, para poder alojarlo en un servicio externo de fotos ya que el principal problema de blogger es que no podemos alojar archivos, yo he usado twango.com pero hay muchos otros, una vez hecho todo este proceso obtenemos la dirección de nuestra imagen que será del tipo http://xxxxx/xxxxnombre_imagen.jpg.

Ahora solo nos queda ponerla en nuestra plantilla de Blogger, para eso buscamos la siguiente linea:

<title><data:blog.pagetitle></title>

Esta línea puede variar algo, pero si no es igual tiene que ser muy parecida. Debajo escribimos el código para nuestro favicon:

<link href='http://xxxxx/xxxxnombre_imagen.jpg' rel='shortcut icon' type='image/x-icon'/>
<link href='http://xxxxx/xxxxnombre_imagen.jpg' rel='icon' type='image/png'/>

Con esto debe de estar todo listo, ya tenemos nuestro favicon en la barra de direcciones del navegador.