« Nuevo driver NVIDIA para Linux | Página de inicio | Visitas de buscadores »

10/11/2006

Personalizado nuestro favicon

 

Hoy me he decidido a cambiar el logotipo (favicon.ico) que aparece en la página del blog al cargar, tanto en el navegador (barra de direcciones) como de las pestañas, cambiando de este modo los que me pone por defecto blogspirit. El proceso no tiene ninguna complicación, solo hay que tener en cuenta un par de detalles y añadir un par de líneas html a las páginas en cuestión para poder cambiar el favicon mostrado.

En primer lugar creamos la imagen o logo que queramos poner, podemos hacerlo directamente en el formato adecuado o en cualquier otro y luego transformarlo, da lo mismo. En mi caso creé el logo usando Babygimp, que es un editor de iconos realizado en Perl/TK. La descargar de BabyGimp se puede realizar desde su página web oficial o simplemente ejecutando lo siguiente ya que se encuentra en el repositorio Universe:

 sudo apt-get install babygimp

Para los usuarios del mundo Windows (que se note que no soy un fanático linuxero,... prefiero considerarme un profeta en tierras hostiles :p) sirven igualmente Photoshop y ArtIcons o cualquier otra combinación que se os ocurra.

1) Creación

Bien, creamos el logo con un tamaño de 16x16 o 32x32 pixels y lo guardamos en formato xpm. El siguiente paso es transformar este fichero de tipo xpm al formato propio de los favicon (.ico). La forma más sencilla y rápida es mediante la herramienta xpm2wico que también se encuentra en los repositorios Universe:

 sudo apt-get install xpm2wico
Una vez instalada ejecutamos: 
 xpm2wico logo.xpm favicon.ico

2) Configuración

Una vez creada la imagen favicon, el siguiente paso es configurar nuestras páginas para que se muestren en los navegadores, para ello, lo que debemos hacer es añadir las dos siguiente líneas entre las cabeceras <head>...</head> de las páginas.

  <link rel="icon" href="http://URL_de_la_imagen/favicon.ico" />
 <link rel="shortcut icon" href="http://URL_de_la_imagen/favicon.ico" />

Esto es todo por ahora, la explicación de como meter varias resoluciones dentro del mismo .ico lo dejamos para otro día, por si alguien está interesado que investigue un poco sobre la herramienta png2ico.

12:25 Anotado en Gráficos, La Red | Permalink | Comentarios (5) | Enviar a Email | Tags: web, iconos

Comentarios

Hola, una preguntita muy novata, como se enlaza una foto con una nota del blog? osea en el navegador de la derecha, por ejemplo la foto de un disco o de una peli, que se pinche y enlace con la nota

Anotado por: Irlanda | 10/11/2006

Hola Irlanda, te contesto mejor por mail.

Anotado por: C0r3Dump | 10/11/2006

ok, mi mail es: losmasverdes@hotmail.com. gracias!

Anotado por: Irlanda | 10/11/2006

perdon, me he equivocado, es losmasverdes@yahoo.es vaya lio con el messenger y el yahoo jeje, pero contestame a este que te digo

Anotado por: Irlanda | 10/11/2006

Tranquila, el mail estaba en tu blog, ya está enviada la respuesta, respondeme al mail para más datos ...

Anotado por: C0r3Dump | 10/11/2006

Dejar un comentario