-->

jueves, 22 de febrero de 2007

Publicar imágenes en Blogger

Rufidor me preguntaba acerca de cómo insertar imágenes en el blog para que al hacer clic sobre ellas se agrandaran. Pues bien, he hecho un pequeño tutorial que os puede servir de ayuda:


Subir una imágen en Blogger: Para insertar una imágen en nuestro blog en primer lugar tendremos que hacer clic en .
Se nos abrirá una ventana en la que podemos elegir si queremos añadir una imagen que esté en nuestro ordenador, o bien añadirla desde una URL.
Una vez elegimos la imagen seleccionamos el diseño y el tamaño que queremos. Yo siempre elijo "grande" porque luego siempre puedes ajustar el tamaño una vez insertada la imagen.
  • En el caso de que lo que queramos sea que al hacer clic en la imagen se agrande sólo tendremos que elegir la opción de tamaño "Pequeñas". Una vez publicada la entrada, al hacer clic sobre la imagen la podremos ver en su tamaño original. Si no quereis usar el upload de Blogger y preferís usar ImageShack para mostrar una imagen pequeña que luego se agrande sólo teneis que copiar en "Edición de HTML" el código que os aparezca al subir la imagen en el recuadro de"Thumbnail for Websites" de dicha web.
Upload de Blogger

Free Image Hosting at www.ImageShack.us

Imagen subida a ImageShack
  • Si lo que quereis es que la imagen se abra en una ventana nueva sólo teneis que seguir los siguientes pasos:
1. Acceder a "Edición de HTML".
2. Vemos que el código que aparece cuando subimos una imagen con el upload de Blogger es el siguiente:

<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="DIRECCIÓN DE VUESTRA IMAGEN EN BLOGGER"><img style="margin: 0px auto 10px; display: block; text-align: center; cursor: pointer; width: 279px; height: 173px;" src="DIRECCIÓN DE VUESTRA IMAGEN EN BLOGGER" alt="" id="BLOGGER_PHOTO_ID_5034290651989024594" border="0" /></a>

3. Antes de
href= tendreis que escribir lo siguiente: target="blank" (Dejando un espacio antes y después; es decir, después de las comillas y antes de href=).

4. Listo, ahora cuando hagais clic sobre la imagen se os abrirá en su tamaño original en una ventan nueva.
  • Si lo que quereis es que la imagen tenga un subtítulo que enlace a ella lo único que tendreis que hacer es escribir antes de </a></div> el texto que querais que aparezca como subtítulo. A continuación pasamos a la pestaña "Redactar" y vemos que el subtítulo aparece, pero alineado a la izquierda. Lo único que tenemos que hacer es centrarlo y listo. (Si quereis que se abra en una ventana nueva sólo teneis que hacer lo mismo que en el caso anterior: target="blank" antes de href)
  • Por último, si quereis publicar una imagen en su tamaño original sólo tenis que subirla a cualquier web de alojamiento de imágenes, tipo ImageShack e insertar en la pestaña "Edición de HTML" el siguiente código:

<center><img src="DIRECCIÓN URL DE LA IMAGEN" /></center>


Espero que os haya servido de ayuda; si teneis alguna duda me lo decís.

3 comentarios:

El Ratoncito Pérez dijo...

Me mola tu blog. Creo que es bastante útil, además me he estado viciando un poco al Maniac Mansion, je, je, je qué tiempos...
Muchas gracias por tu visita, creo que en cuanto tenga tiempo te enlazaré. Saludos!!!

Rufidor dijo...

Muchas gracias! Este tutorial me será muy útil, ya he puesto una foto así :D. Gracias de nuevo!

Benyi dijo...

Hola efecinco!! Me suscribo!! Te conocí gracias a ZONA FIREFOX.

Saludos.

 
Copyright © 2007 | Diseñado por BlogyWeb