Entendiendo el codigo para agregar FOTOS o Imagenes al Blog, Blogger

Lo importante es la direccion en donde esta alojada tu foto (http:// …), el resto del codigo siempre sera igual. Por ejemplo si subimos nuestras fotos a la pagina de Uploadhut (tambien puedes subirla a ImagesHack ahora que uploadhut no entrega el link directo) esta nos entregará el siguiente código:

CON UPLOADHUT:

  1. <img src="http://www.uploadhut.com/upload/242690.jpg??" alt="Image Hosted by UploadHut.COM" />

En cambio, si subimos nuetras fotos con Hello de Google, el código entregado es distinto
Primero, cuando quieran copiar cualquier código trabajen en HTML(Edición de HTML) no en COMPOSE (Redactar)(Pichar para Agrandar), como se ve en la figura:


Así se ve la forma que tiene un post cuando se agregan figuras(Pichar para Agrandar):

Cuando suben mediante Hello (programa que ofrece Blogger) en el post queda listo el código correspondiente a la foto.
Como ven la misma foto se aloja en dos paginas distintas dependiento si las subo con UPLOADHUT o con HELLO, este es el codigo que entrega HELLO:

CON HELLO:

  1. <a href='http://photos1.blogger.com/img/282/6361/1024/bscap014.jpg'><img border='0' style='border:1px solid #000000;margin:2px' src='http://photos1.blogger.com/img/282/6361/400/bscap014.jpg'></a>

A pesar de que Hello, entrega el código listo, explicaré como esta formado este código, para que puedan realizar modificaciones, como eliminar los links hacia la imagen grande, y dejar solo la pequeña, o dejar un link de descarga de la imagen…para esto necesitan entender lo que explico a continuación.

Para ingresar una imagen se distinguen 3 partes(cada parte es un texto entre signos menor y mayor):
La primera parte que se distingue es el link a la pagina en donde esta la foto(si no hay link, entonces la foto no se puede agrandar, no aparece la manito cuando se pasa por sobre la foto, solo se ve lo que se ve)..jajajja.

Primera Parte:

  1. <a href="http://www.uploadhut.com/upload/242690.jpg??">

Si ustedes ponen la direccion de la pagina que aparece arriba “http://www.uploadhut.com….”
en explorer aparece la foto…

La segunda parte que se distingue es la parte que hace que la foto se vea, ES:
(Si quieren que se vea solamente la imagen sin referencia a ninguna parte, entonces basta con agregar solamente esta parte del codigo. De esta manera, cuando la gente pinche en la imagen no pasará nada…)

Segunda Parte:

  1. <img src="http://www.uploadhut.com/upload/242690.jpg??">

Y finalmente la tercera parte es esta (que cierra la etiqueta del link <a href=.. ):

Tercera Parte:

Si se dan cuenta en la primera parte aparece un a href, y con la tercera parte se cierra este comando. Lo que hace este comando a href es que además de mostrar la imagen(con la segunda parte del codigo), cuando la gente pase el mouse sobre esta, y pinche…se abra una nueva pagina en donde se mostrará la imagen en el tamaño original.
En forma global una imagen tiene la siguiente forma:

  1. <a href><img /></a>

De lo anterior la foto queda asi, si agregan las tres partes (para que noten la diferencia):

(Si quieren que la imagen se abra en una ventana nueva, revisen este otro post: Abrir en Nuevas Ventanas)

También, Por ejemplo podrían poner:

  1. <a href="http://photos1.blogger.com/img/282/6361/1024/bscap014.jpg">PINCHEN AQUI PARA DESCARGAR LA IMAGEN ORIGINAL</a><br />
  2. <img src='http://photos1.blogger.com/img/282/6361/400/bscap014.jpg' />

y lo que obtendrian es lo siguiente:

PINCHEN AQUI PARA DESCARGAR LA IMAGEN ORIGINAL

Como ven ahora no pueden pichar sobre la figura, pero sí pueden pichar sobre PINCHEN AQUI PARA DESCARGAR LA IMAGEN ORIGINAL….esa es la diferencia, el link esta en la palabra no en la foto.
En forma global tiene la siguiente forma:

  1. <a href>PINCHEN AQUI PARA DESCARGAR</a><img />

Espero que haya quedado más claro. Por último si no pueden mandenme un mail y les mando el codigo listo para que lo copien en el post..

Actualizaciones del Post:
14/09/2007
Lamentablemente UPLOADHUT cambio su servicio y ahora no se puede acceder directamente al link donde estan alojados los archivos. Yo subí los archivos en mi servidor, para que vean el efecto, queda directamente descargable. Si necesitan otros servicios para hacer esto, pueden revisar el siguiente post, que contiene una lista bastante grande: Paginas para Subir Archivos. Gran parte de las páginas que ofrecen hosting gratuito utilizan CPANEL, y se puede obtener el link de la misma manera que yo acabo de mostrar en este post. Tambien como ya mencioné en el post pueden utilizar http://www.imageshack.us/

Artículos Relacionados

  • Monadas Varias Esto lo pueden utilizar en cualquier plataforma de blogs (Blogger, WordPress...) Calendarios: Preciosos Calendarios, con muchas categorías. (Animated, Cars, Nature, Abstract, Animals, […]
  • Como ver un Gadget solo en la pagina principal, Blogger Esto sirve solo para las personas que quieran ver un gadget o widget cualquiera solamente en la página principal de blogger, osea por ejemplo, puedes insertar si quieres un tipo de […]
  • Mas Juegos para el Blog En http://www.owensworld.com/flashgames/games-all.htm encontraran una lista muy grande de juegos para el blog. Primero pinchen en el tipo de juego que les gusta (accion, aventura, […]
  • Encuestas en Dpoll Actualización del Post: 11/09/2013 El sitio dpoll ha cambiado completamente, aun se pueden hacer encuestas y agregarlas en tu blog, como la que he dejado de ejemplo aca, pero ahora el […]
  • Bravenet ha cambiado, de imagen y ahora ofrece Host para subir archivos Bravenet ha cambiado de imagen, todavia no sé el espacio que ofrece para subir archivos, pero lo que me ha llamado la atencion, es que se pueden crear cuentas ftp, basededatos (pero […]
  • Cuenta Regresiva para FECHAS IMPORTANTES, Classic-Blogger Voy a mostrar dos códigos diferentes que sirven para tener una cuenta regresiva en el blog. 1º Forma de Hacerlo: Este código Funciona para explorer y Firefox. Para tener nuestra […]
Soy Blogger desde hace mucho tiempo. Inicialmente este blog se creó para entregar tutoriales paso a paso a las personas que estuvieran ingresando al mundo online. Muchos de mis tutoriales no requieren de conocimiento previo ni habilidades, la idea siempre fue tender una mano a los que usualmente no entienden nada. Como pueden ver estuvo bastante abandonado por varios años pero ahora lo retomaré con otro énfasis, explicación de herramientas mas complejas, y en la medida de lo posible se irán renovando los post que con el tiempo han quedado obsoletos.

About patriram

Soy Blogger desde hace mucho tiempo. Inicialmente este blog se creó para entregar tutoriales paso a paso a las personas que estuvieran ingresando al mundo online. Muchos de mis tutoriales no requieren de conocimiento previo ni habilidades, la idea siempre fue tender una mano a los que usualmente no entienden nada. Como pueden ver estuvo bastante abandonado por varios años pero ahora lo retomaré con otro énfasis, explicación de herramientas mas complejas, y en la medida de lo posible se irán renovando los post que con el tiempo han quedado obsoletos.

Leave a Reply

Your email address will not be published. Required fields are marked *