8/3/12

Cómo insertar un “.gif” animado en tu blog

Inicio / Top

Desde que di vida a este blog, suma de mis pequeñas inmersiones en HTML y de la oportunidad que “Blogger” nos proporciona a todos los que queremos hacer de nuestra voz un eco electrónico, telemático, y/o informático, como prefiráis, mi entrada sobre cómo diantres hacer que nuestro blog sea más atractivo o curioso a la vista gracias a estos bichitos que por extensión tienen un punto seguido de una “g”, una “i”, y una “f” (en otras palabras, Graphics Interchange Format) ocupó el primer puesto de visitas (en mi blog, claro está) desde que a través de un click subió desde mi portátil al hiperespacio electrónico surfeando sin tabla de ídem.

Por ello doy un homenaje a la misma, volviendo a que aparezca ante vosotros, con un aire un poco más renovado. Eso sí, manteniendo la esencia y cada palabra, sin omitir siquiera coma, punto y punto y aparte algunos. Por parte de su contenido, ha adquirido cierto anacronismo, mas como el tiempo es una dimensión más a tener en cuenta (gracias, Sr. Minkowski), ¿por qué no viajar a través de él? Agradeciéndoos como es habitual el tiempo que dedicáis a la lectura de este mi y vuestro blog (y sin querer parecer esto último una solicitud o instancia a vaya usted a saber qué) a continuación la entrada estrella. Adelante:

Creo que no pude escoger mejor título para éste mi blog y el de todos vosotros. “Cajón desastre” (evidente juego de palabras) me permite la libertad de escribir sobre cualquier asunto y en cualquier orden; bien es verdad que, conociéndome, siempre estará presente un cierto orden y concierto; las ideas necesitan del concierto y del orden para que éstas estén bien expresadas. Por mi perfil habréis observado que, además, creé otros dos blogs, “La Magia del Péndulo” y “Tiras cómicas, or comic strips, as you like”; disculpad el retraso en los mismos; aunque intento estirar el tiempo es evidente que hasta ahora no he conseguido llegar al punto de rotura. No obstante, estad alertas, algún día cercano se abrirán paso en esta Web que ahora es llamada semántica, y en ellos compartiré con vosotros dos de mis grandes aficiones: la práctica y teoría de la Radiestesia y el dibujo de tiras cómicas de mi propia creación.

La entrada de esta noche la dedicaré a intentar resolver vuestras dudas sobre cómo lograr que nuestras imágenes animadas en formato .gif, esas en las que hemos invertido horas y horas de nuestro precioso tiempo, puedan ser tratadas como tales en nuestros blogs de Blogger.

Después de muchas vueltas, editar códigos HTML por aquí y por acullá, crear imagen, subir imagen, volver a editar imagen, vaya, resulta que no era eso, bien, probemos lo otro, nada, que no, que por mucho que lo intento, no hay manera, Blogger no trata mi imagen animada como tal, tan solo muestra la primera imagen de la serie. La frustración se incrementa cuando descubro que hay usuarios que sí lo han logrado, simplemente con usar el “gadget” de Blogger “imagen”. Pues no, señores, no hay manera, con otros podrá ser pero con mi .gif “nanay de la China”.

A punto de abrir una caja de turrón que quedó de las Navidades pasadas para aliviar mi pesar y desánimo (menos mal que voy al gimnasio y practico “jogging” los fines de semana), me doy de bruces con un interesantísimo blog que aquí os recomiendo, http://blogger-tricks.blogspot.com/, propiedad de un “bloggero” de cabo a rabo. El blog está escrito en un perfecto y correcto inglés, y para el no avezado en el idioma indicaré los pasos a seguir, si bien, además, nuestro protagonista suele irse por las ramas de la programación, al igual que yo con las de las ideas.

Una vez creado el archivo .gif (menuda perogrullada) haremos lo que a continuación indico esquemáticamente:

1) Abrir una cuenta en Photobucket (es gratuita).

2) Creamos en Photobucket una carpeta, y le daremos nombre.
3) Subimos nuestro archivo .gif a la carpeta creada en Photobucket. 4) Al subirlo, nos pedirá que le demos un nombre, y lo más interesante, podremos asignarle una URL para que apunte adonde queramos.

5) Pinchamos en “select/unselect all” (aparece debajo de nuestro archivo).

6) Accedemos a “Generate HTML and IMG code”.

7) Dentro de la opción, copiamos el contenido de la caja denominada “HTML clickable thumbnails…”

8) Substituimos el contenido de “<a href=” por el de la URL a la que queremos ir cuando pinchemos en nuestro .gif, sin eliminar a partir del comando “target”. De esta forma hacemos que la secuencia busque nuestro archivo en Photobucket, la inserte en nuestro blog creado en Blogger y haga que al pinchar en nuestro archivo vayamos a la página que nosotros queramos.

9) Consejo para el punto anterior: Primero copiar con el ratón el enlace (situarse dentro de la caja y pinchar con el botón izquierdo, después seleccionar copiar con el derecho); segundo, pegarlo en el portapapeles; tercero, editarlo en el portapapeles.

10) Ya editada nuestra URL en HTML, la copiamos y posteriormente la pegamos en el “gadget” de Blogger denominado “HTML/Javascript”, y guardamos. Ya tenemos nuestro archivo .gif, y animado, en nuestro blog.

 
Siguiendo este procedimiento (espero no haber omitido algún paso importante) conseguiremos ver nuestras animaciones en Blogger. La animación que podéis ver debajo de mi perfil fue subida con éxito siguiendo estas indicaciones.

¿Por qué semejante jaleo, si me permitís la expresión? Pues por que Blogger no interpreta correctamente todos los archivos .gif animados que son colgados en este entorno. Y por eso se hace necesario en la mayoría de las ocasiones alojar nuestro archivo en un servidor externo que admita los citados archivos (de todos los que he consultado, escogí Photobucket por su magnífico entorno de trabajo y gratuidad; eso sí, preparaos a ser asaltados por publicidad constante).

Espero haber contribuido con mis palabras a facilitar que vuestros blogs cobren el aspecto que siempre habéis deseado. Por otra parte, os recomiendo que consultéis la ayuda propia de Blogger; está muy bien estructurada y organizada por temas (al fin y al cabo es un producto Google). ¡Ánimo, y a subir vuestros archivos animados!