lunes, 14 de junio de 2010

Poner un favicon animado en blogger



 Cuando quieres poner un favicon en tu blog, podras encontrar muchos sitios de referencia, pero todos te explican de una forma muy resumida cosa que para algunas personas como yo, es algo complicado.
Hoy les quiero mostrar de una forma bien explicita como lo hice, pasa a paso para aquellas personas, asi com yo les cuesta un poco esto del diseño y los codigos html,xml, etc.

Lo primero que deben hacer es una imagen en png de como quieren que sea su favicon, entoces habren sus gimp y crean un nuevo documento de 32x32 pixel, despues lo rellenan del color que quieren con el bote de pintura, crean una nueva capa y click en la letra A para escribir eltexto del favicon, yo puse CE(crear tu ebook).
Una ves terminado lo guardan como imagen .png en el escritorio y vamos a esta web, donde dice Examinar le dan click y buscan el archivo de su favicon y luego a create favicon .ico, les pasara a otra pagina donde veran el favicon y un favicon animado, selecionamos el favicon animado le damos en Edit y nos dara una serie de opciones en la parte de abajo, en el primer item nos dice your text(tu texto), en ese lugar escriben el nombre de su web, en mi caso Crear tu Ebook y luego ok. Al terminar de cargar veran como queda, si les gusta le dan en Download favicon package y les descargara en un archivo Zip, en su escritorio. Lo descomprimen y luego buscan el archivo favicon animado que lo deben subir a esta pagina llamada Tinypic  y nuevamente examinar y buscan el archivo favicon_animado.gif y luego cargar ahora, completan el capcha y les dará 4 direcciones para usar en diferentes lugares, uds. elegirán el cuarto el que dice Enlace directo para presentaciones, lo copian en un blog de notas para que no se les pierda.

Luego vamos a nuestra cuenta de blogger-diseño-edicion html y aprietan Ctrl+F para el buscador de html de blogger y ponen en el <head> y justo debajo pegan este codigo:

<link href="URL" rel="icon" type="image/gif"/>

Donde dice URL ponen la dirección que copiaron de Tinypic y guardan la plantilla.
Luego ven como queda, si lo hicieron bien sera como mi favicon.

Si te gusto el post deja un comentario que con gusto te lo voy a responder y si no te gusto es una lastima, nadie es perfecto, voy a mejorar.

3 comentarios:

MundoPhotoshopero dijo...

Muy bueno, es de gran utilidad tu ayuda ya que de esta forma podemos colocar imagenes con diferentes extensiones, te falto aclara que para subir un archivo con extension .png hay que modificar el final donde dice type="image/gif"/ de acuerdo a la extension del link que se desea utilizar. Esto lo descubri al darme cuenta que no aparecian las imagenes png/jpg que agregaba.

Gracias!! ^^

Sergio dijo...

Si es cierto, ademas la web donde vas para crear el favicon animado trae un archivo de texto donde tiene resumido el codigo, hace poco cambie el favicon de mi web http://www.portalvete.com ahi la cosa se complica un poco pero en otra ocacion voy a explicar en un post como lo hice ya que no puede encontrar mucha informacion por la web

Sergio dijo...

perdon me olvide de decir que la web que tengo es con un CMS joomla y para la version 1.5 es diferente la colocacion del favicon

Related Posts with Thumbnails