jueves, junio 14, 2007

Personaliza tu barra de dirección

Seguro que alguien se habrá dado cuenta de la nueva personalización de mi blog, el último detalle que he añadido ha sido el de una estrellita en la barra de direcciones, con esto también se consigue que este icono se grabe cuando nos agreguen a marcadores. Pues nada, para el que le guste aquí os cuento cómo se hace.

Primero debemos diseñar nuestro dibujo, da igual el tamaño, puesto que utilizaremos una página web para convertir nuestro diseño en un icono. La página en la que debemos entrar para ello es http://www.chami.com/html-kit/services/favicon/. Lo único que hay que hacer es darle al botón de examinar para buscar nuestro archivo en el ordenador y cuando lo tengamos pinchamos en el botón Generate FavIcon.ico. Pues ya está, ahora sólo tenemos que descargar el comprimido generado a nuestro ordenador y descomprimirlo. Ya tenemos nuestros iconos, estáticos y dinámicos, aunque con blogger debemos utlizar el icono dinámico.

Vamos a comenzar el proceso. Primero vamos a guardar la imagen en el sevidor de Blogger, para ello hacemos una entrada nueva e insertamos la imagen (la que se mueve). Ahora necesitamos el código de esa imagen, para obtenerlo pinchamos en Edición en HTML (está en la parte superior derecha del recuadro en el que escribimos las entradas) y tendremos algo así:

'<'a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://bp2.blogger.com/_sH5-mdzelg4/ Rm-jj8_uUQI/AAAAAAAAAAo/ KeHP18VJrYw/s1600-h/ animated_favicon1.gif"'>' '<'img style="margin: 0pt 10px 10px 0pt; float: left; cursor:pointer;"src= "http://bp2.blogger.com/_sH5-mdzelg4/ Rm-jj8_uUQI/AAAAAAAAAAo/KeHP18VJrYw/ s320/animated_favicon1.gif" alt="" id="BLOGGER_PHOTO_ID_5075455143133991170" border="0" /'>' '<'/a'>'
La parte que está en amarilla es la que vamos a necesitar, así que la guardamos en un documento de texto o la apuntamos, pero exáctamente igual puesto que vamos a modificar el html de la plantilla.

El paso siguiente es entrar en la pestaña Plantilla (del diseño del blog) y luego en Edición en HTML. De lo que sale ahí posiblemente no entendamos nada, pero no importa, tenemos que buscar al principio de ese texto la etiqueta HEAD y justo debajo de ella tenemos que poner lo siguiente, pero atención, los símbolos <> vienen '<' y '>', las comillas esas no hay que ponerlas, solo las pongo yo aquí puesto que es código html y no podría ponerlo de otra forma, entonces sería <>, sin las comillas simples.

'<'link href='http://bp3.blogger.com/
_sH5-mdzelg4/RnFijs_uUUI/AAAAAAAAABI/rdQ_51cWqPg
/s400/animated_favicon1.gif'

rel='shortcut icon' type='image/x-icon'/ '>'

La parte amarilla si os dais cuenta es la misma que copiamos antes, entonces en ese lugar tendréis que poner lo vuestro, ya que ese texto equivale a mi imagen. Pues nada, guardais los cambios en la plantilla y si todo está bien, cuando visualiceis el blog os aparecerá el icono elegido :).

9 comentarios:

  1. Hola, se que lo tienes todo muy bien explicadito todo. Pero lo he hecho paso por paso y cuando le doy a guardar cambios me da error y no me deja guardarlos. Hay que hacer algo más? Un saludo y gracias

    ResponderEliminar
  2. Hola!! Quería darte las gracias por este truquillo tan curioso. Parece una chorrada pero le da un toque de distinción al blog.. ;-)

    De momento he creado un cutre-icono con el paint para ir tirando, pero supongo que lo acabaré cambiando por uno mejor. Si quieres ver cómo ha quedado visita mi blog, http://cancionesaparte.blogspot.com/

    Gracias de nuevo. :)

    ResponderEliminar
  3. olle a mi tambien me da error
    por que puede ser???

    ResponderEliminar
  4. Hola! me gusto mucho tu blog, y todas las cositas que has puesto porque esta todo muy explicadito, gracias!!

    puse un gatito con alas en mi barra de direccion de mi blog de razas de gatos, queda precioso!!

    ResponderEliminar
  5. Hola! No sabía que se podía hacer eso en el blog, acabo de hacerlo y queda muy bien :) Lo único es que al principio daba error y era porque tenía que darle a "Expandir plantillas de artilugios".

    Saludos :)

    ResponderEliminar
  6. HOLA MASTER LO HISE I NO ME DIO ERROR ME DIO COMO Q ESTUVO TODO BIEN PERO A LA HORA DE VER LA IMAGEN NO ESTA ME APARECE UNA IMAGEN DE UNA HOJA,,,,:S AGRADECERIA Q ME AYUDARAS AHI VA EL MIO WWW.LOSPIRATASDELESTE.BLOGSPOT.COM

    ResponderEliminar
  7. TE DEJO MI MAIL NICOP_LMJ@HOTMAIL.COM

    ResponderEliminar
  8. :( ami tampoco me sale mi imagen :S
    me sale la delBloG
    LA fe B anaranjada :S!!
    porque sera :(
    espero tu respuesta :D

    ResponderEliminar
  9. Holap pues lo malo sk la imagen solo hay komo verla en firefox y no en explorer asi k si lo hizieron con explorer y no les sali no se preokupen abran su blog con firefox y van a ver komo les kedó...suerte...salu2:D

    ResponderEliminar