viernes, 22 de junio de 2007

Cómo cambiar un icono en un buscador de la barra de firefox

Supongamos que tenemos un buscador para la barra de búsqueda de firefox sin icono (o que nos hemos hecho uno siguiendo estos pasos y queremos cambiar el icono de google por otro).

La descripción del buscador está en una carpeta dentro del directorio de firefox (en windows XP en "C:\Archivos de programa\Mozilla Firefox\searchplugins"). Abre los .xml en un editor de texto hasta que encuentres el que corresponda al buscador (puedes mirar que lo que está dentro de <ShortName> corresponde al nombre que aparece al elegirlo).

Vale, ahora buscamos una línea cómo esta:

<Image width="16" height="16">data:image/x-icon;base64,[cadena de caracteres muy larga]</Image>


Si no la tienes, cópiala y pégala allí (después de <SearchPlugin> y antes de </SearchPlugin>, no se te ocurra pegarla al final). La cadena de caracteres es una imagen escrita en modo texto. Tenemos que sustituirla por la cadena que corresponde a nuestra imagen.

Obviamente, primero necesitamos una imagen. Para ello:

  • La página del buscador tiene un iconito:

    Buscamos entonces la dirección del icono. Abre el código fuente de una página que muestre el icono y busca algo como:
    <LINK rel="icon" href="/favicon.ico" type="image/ico" />


    Si href no tiene una dirección completa (no empieza por http), necesitamos crear una dirección completa. Para ello sustituye todo lo que esté tras la última barra "/" de la dirección de la página de la cual estás mirando el código fuente por lo que aparezca en href, por ejemplo, si es href="/favicon.ico" y estás en "http://www.boardgamegeek.com/profile.php?action=viewmine", la dirección será http://www.boardgamegeek.com/ profile.php?action=viewminefavicon.ico = http://www.boardgamegeek.com/favicon.ico. Si la dirección no tiene una barra "/" (aparte de las que siguen a http) simplemente añade lo que pone en href al final. http://www.boardgamegeek.com se convertirá en http://www.boardgamegeek.com/favicon.ico.

    Ahora copia la dirección completa y ábrela en el navegador. Te debería aparecer un icono. Guárdalo en tu ordenador.

  • La página del buscador no tiene un iconito:

    Bueno, mala suerte. Necesitamos una imagen que represente a la página.

    Si tiene una imagen a propósito (algo representativo y no muy grande), dale a botón derecho y selecciona guardar imagen.

    Si no tiene una imagen a propósito, tendremos que crearnos una. Para ello, le damos al botón del teclado Impr Pant (Imprimir Pantalla) con la página abierta, abrimos el paint o similar, y le damos a pegar (si te pregunta que si quieres que crezca la imagen, dile que sí). Ahora selecciona una parte más o menos cuadrada (por ejemplo un logo o la inicial en el título) y copiala. Abre una imagen nueva y pega la selección que hemos hecho (si sobra fondo, en paint por lo menos puedes poner un tamaño de imagen muy pequeño, incluso de 1 pixel por 1 pixel y al pegar te crecerá lo justo, en otros programas te puede abrir incluso una nueva imagen con lo que tengas en el portapapeles y el tamaño adecuado). Guarda la imagen como jpg (si tiene muchos colores), gif o png.

    Una vez tengamos una imagen, tenemos que convertirla en un iconito. Hay páginas en internet como ésta que te permiten hacerlo. Dale a examinar, selecciona tu imagen y dale a generar.


Cuando ya tengamos el iconito, tenemos que generar la cadena de texto que le corresponda. Para ello vamos a esta página (la mencionaban en la ayuda de firefox, si no funciona, busca algo como "image to base64"). En "upload a file" buscamos nuestra imagen y luego le damos a generar. Dará como resultado un enlace, cópialo (el texto y el contenido del enlace son idénticos). Si en lugar de eso sale una cadena de caracteres rara, copia la dirección de la barra de direcciones del navegador. Lo que necesitas empezará con algo como "data:text/plain" o "data:image/x-icon;base64" o algo similar...

Volvemos a nuestra linea en el fichero xml de descripción del buscador.
<Image width="16" height="16">data:image/x-icon;base64,[cadena de caracteres muy larga]</Image>

Tenemos que sustituir todo lo que está entre <Image width="16" height="16"> y </Image> por lo que hemos copiado ahora.

Una vez hecho ésto, guarda el xml, cierra el firefox, y al abrirlo de nuevo aparecerá el icono al lado del buscador.