Imagenes a tamaño "real" en Blogger
Si subimos las imágenes de nuestras entradas mediante el editor de Blogger, ya sabemos que el tamaño máximo permitido es de 400 pixeles tanto en el ancho de las imágenes horizontales como en el alto de las imágenes verticales.
Esta limitación es debida a que el editor de Blogger trabaja suponiendo que se está usando una de sus plantillas, donde el ancho del main (cuerpo de entradas) no supera los 470 pixeles de anchura.
Muchos de nosotros usamos plantillas modificadas en las que, el ancho de entradas sobrepasa fácilmente los 470 px por lo que, las imágenes subidas desde el editor se nos quedan pequeñas.
Es sencillo el conseguir que esta limitación no nos impida mostrar en el blog las imágenes a su tamaño real teniendo en cuenta, por supuesto, no incluir imágenes mayores que el ancho de nuestras entradas o estas se verán cortadas.
[1] Accedemos a nuestro panel de Blogger desde Blogger in Draft.
[2] Nos situamos en nuestro editor de entradas y subimos la imagen escogida.
[3] Una vez subida la imagen, en la pestaña "Edición de HTML" del editor podemos ver el código que se ha generado para ella:
<div class="separator" style="clear: both; text-align: center;">
<a href="http://1.bp.blogspot.com/_8PJ-pgoBhWQ/SP42cEckHSI/AAAAAAAAEfs/pJ6bDEJM7wg/s1600-h/Casa-de-madera-imagenes.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://1.bp.blogspot.com/_8PJ-pgoBhWQ/SP42cEckHSI/AAAAAAAAEfs/luwJRwJ9uUs/s320-R/Casa-de-madera-imagenes.jpg" /></a></div>
[4] Dentro de ese código cambiamos s320-R por s00-R y ya tendremos la imagen a su tamaño real.
Sucede entonces que, una vez publicada la entrada, al pinchar sobre la imagen esta se abrirá como sucede habitualmente en una nueva página a su tamaño real.
Ya que el tamaño de las dos imágenes será entonces igual, podríamos prescindir de usar el enlace que muestra la segunda imagen al pinchar sobre la publicada en el post, para ello eliminamos del código lo que está en color rojo:
<div class="separator" style="clear: both; text-align: center;">
<a href="http://1.bp.blogspot.com/_8PJ-pgoBhWQ/SP42cEckHSI/AAAAAAAAEfs/pJ6bDEJM7wg/s1600-h/Casa-de-madera-imagenes.jpg" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="http://1.bp.blogspot.com/_8PJ-pgoBhWQ/SP42cEckHSI/AAAAAAAAEfs/luwJRwJ9uUs/s320-R/Casa-de-madera-imagenes.jpg" /></a></div>
a las
Etiquetas:
Blogger,
Trucos imagenes
Vitua Radio
Foro SpamLoco
Seguir el Escaparate
60 comentarios:
Genial. Hace semanas que no te pillaba algo. Pero esto me gusta y lo he necesitado a veces, sobre todo ahora con el nuevo diseño de mi blog. Por cierto, aprovecho para darte la enhorabuena por el cambio de diseño que has hecho.
Saludos.
Pues MUCHAS GRACIAS ROSA. Esto era todo lo que queria saber :D.. Ya se como hacerlo (es muy facil).. Muchas GraciaS!! Entonces de ahora en adelante usare Blogger in Draft como Escritorio :D
Y si la pregunta de Twitter va dirigida a mi........... Quizas despues me anime a usarlo jajaja.
Saludos Rosa!
Thanks You!
Gracias Rosa una vez más! apuntado queda el detallito!! yo en Date prisa tengo restricción por aquello de que es una plantilla adaptada para blogger (bueno! y el resto de mis blogs son todos adaptados jajajja menos el Averno!) pero nunca está de más saberse todos estos truquitos, por lo que pudiera pasar!!
besito!! y decirte ¡que me encantó la fotito que elegiste! es mi casa ideal :D y desde luego se ve mucho mejor y luce más a este tamaño ;)
que pases buena noche
Ahhhhhhh Rosa, esto me viene como oro!
Muchas Gracias!
(Oye, qué bonita está la página ;-))
Un beso
Rosa.
Esto es nuevo o es que ya tiene tiempo y no me habia fijado en eso:
http://img370.imageshack.us/img370/1482/dibujogc2.png
Pedrox, es nuevo, pero parecer ser que no funciona...al menos a mi no :-(
A mi tampoco me funciona...
Seguro sera como lo del Ranking.. Despes de un tiempo comenzara a funcionar..
Saludos!
La casa es preciosa jajajaja
Ahora en serio, es un buen método ;)
Gem@, y tanto...casi parece de mentira :-)
¿? muy util la info, pero mi blog tiene las entradas de 470 pixeles, sabes como la puedo agrandar, ahh y otra cosa ahora cuando subo imagenes a las entradas, no me funciona esa cosa para dejarlas en tamaño pequeño, medio o grande, me la deja del tamaño original, que curioso jejeje, y tengo que modificarla manual mente, sabes algo sobre ese problema??
ahh una cosa el problema sobre las imagenes grandes, me viene pasando de hace como casi una semana
dicc93 Blogger está dando problemas con algunas cosas como esas que me dices...supongo que es debido a las pruebas para los últimos cambios...habrá que esperar a ver.
No se cual es tu plantilla, pero mira arriba en mi menú en "Plantillas" que hay alguna entrada sobre ensanchar plantillas dependiendo del modelo.
Hola una preguntita, hay un limite de imagenes que se pueden colocar por entrada o es ilimitado
Blackout, no hay límite.
Ey Rosa que tal. Te descubría ayer, eres una máquina de esto... Te dejo en esta entrada el coemntario porque es sobre el tamaño de las fotos. COmo verás por mi blog me encanta la fotografía y me gustaría que la foto se viera en todo su esplendor o por lo menos mayor que la que te aparece ahí. He intentado seguir los pasos que pones, pero se me escapa algo porque no me sale. Me lo podrías explicar?
Gracias y saludos: Elena
Helena de Troya , no se que más podría decirte que lo que explico en la entrada...tendrías que ser tu quien me dijeses en que te falla o si has tenido problemas al seguir las instrucciones...no se.
Muy bueno el POST ROSA! Un unica consulta es imposible modificar el tamaño predeterminado de 400 pixeles desde la planilla? MIL GRACIAS
HISPANO
www.hispanofc.net
SR.HISPANO, no, las imágenes solo pueden modificarse una vez subidas a la entrada y siempre en el código de cada una.
Rosita no se quien seas pero vaya que me has resuelto un problemón que me tenía loco desde hace varios meses. Te debo una, estoy en deuda. Ah por si acaso te enlacé a mi blog. Nos vemos
Marcz , no me debes nada, con haberte sido de ayuda me conformo. Gracias!
hola rosa, el codigo que se genera en mi blgo no se parece en nada, en el mio, pone algo de onblur, y no se que hacer con ello, estoy desesperado, ya que, puedo cambiar el tamaño de las imagenes cambiando el ancho y alto, pero como primero las redimensiona, luego al aumentarlas, pierden muchisima calidad...
Alex, ¿no has leído el comienzo de la entrada?
[1] Accedemos a nuestro panel de Blogger desde Blogger in Draft.
siento si te ha molestado la pregunta.
la verdad es que me he leído y reeleido mil veces la entrada, y no consigo dar con lo que se me escapa...
quizás tu pudieras iluminarme..
para subir las imágenes, hago lo normal, cuando escribo una entrada, le doy a añadir imágenes, y desde ahí las subo, pero ya directamente me genera el codigo raro, y se redimensionan a 400px, siendo el ancho que necesito de 530 px.
repito, siento si te ha molestado mi comentario.
http://nordriesen.blogspot.com/
Alex, ni mucho menos, perdóname, tal vez la forma de expresarme te ha dado esa impresión...
Verás, esto que explico en esta entrada, no puedes hacerlo desde el panel de Blogger "normal" por el que entras normalmente a tu blog, porque si lo haces desde ahí el código que sale es ese que dices tu.
Tienes que entrar desde Blogger in Draft y hacer lo que me dices que haces normalmente...subir la imagen y demás, verás como el código que resulta entonces te permite hacer lo que explico aquí.
Hola Rosa, queria hacerte una pregunta(que no tiene que ver con esta entrada en si).
Hay alguna forma de quitarle el enlace que blogger les pone a las imagenes? Digo el enlace que hace que se agranden las fotos en una nueva ventana cuando hacemos click.
Pero me refiero a algo universal, que lo haga automaticamente en todas las fotos(Ya que foto por foto lo se hacer, pero me resulta molesto ya que en mi blog subo muchisimas fotos) De antemano gracias!
Pucho, no, de forma automática no.
Me funcionó de maravilla tu consejo!!! Gracias!!! Y quiero hacer un aporte personal al respecto por si a alguien le interesa: SÍ se pueden subir imágenes más grandes que el ancho de nuestras entradas... descubrí que luego de modificar el html tal como recomiendas te vas a la pestaña REDACTAR y ahi la puedes ajustar estirándola o jalándola manualmente hasta ajustarla al ancho de la columna y TE LO RESPETA PERFECTAMENTE para que la imagen no se vea cortada!
Ah! y otra cosa yo lo hice primero desde el Blogger in Draft como lo recomiendas, pero también me funcionó de maravillaen el blogger normal.
Jhan , lo de "estirar" manualmente a veces deja la imagen algo "deformada" pero bueno, se trata de usar la opción que más nos agrade.
Tengo que mirar en Blogger "normal" a ver si yo puedo, hasta hace poco allí al menos a mi, no me funcionaba.
¡Gracias!
HOLA ROSA SE PUEDE DENEGAR QUE ALGUIEN COPIE UNA IMAGEN AUQNUE ESTA ESTE YA EN GIF.SI NO TENDRE QUE PONDERLE UNA MARCA DE AGUA
Armando, mira si te sirve esta entrada para eso:
http://elescaparatederosa.blogspot.com/2007/02/impedir-guardar-imagen.html
Hola. A mi me gustaría saber cómo hacer que no se abra la imagen en su tamaño original al hacer clic en la foto. No sé si me explico. Gracias
Brochazos No puedes controlar eso...lo único que puedes hacer es evitar que se abra, es decir que cuando pinches en la imagen no pase nada:
http://elescaparatederosa.blogspot.com/2007/11/imagenes-sin-link-en-blogger.html
ROSA, DESDE HACE UN MES TRATO DE SUBIR IMAGENES CON ESTE METODO, YA ERA ALGO QUE DOMINABA PERO ME DICE QUE FALLO AL CARGAR Y ME SALE UNA VENTANA DICIENDO SI QUIERO GUARDAR LA IIMAGEN O ABRIRLA, UTILISE FLICKR Y SOLUCIONE PERO NO ME DA EL TAMAÑO QUE QUIERO QUIERO,, TE HA PASADO, ES ERROR MIO ME DICE UN ERROR INTERNO PERO NO SE QUE,,,BYE
armando hernandez Es raro eso que dices...¿has limpiado la cache de tu navegador o probado a hacer eso mismo con otro navegador?
Hola Rosa, subi la imagen de la entrada Trayectoria y otra imagen en la entrada ''Nota'' con este truco de tamaño real, pero lo primero que se ve es un icono con un signo de pregunta. Sabes porque? Maria (c)
c No tengo idea :O
He ido a ver las entradas que dices y no veo las imágenes colocadas ni el signo que dices... si pudiera verlo insitu me ayudaría para orientarte con esto.
Rosa, Gracias por responder siempre... En la entrada: ''Curriculum escrito'' finalmente escribí un texto y puse una imagen de fondo que como veras , tampoco se ve. Y en la entrada llamada ''Nota'', a ambas entradas podes acceder desde el ''indice de contenidos'', en esta ultima (Nota) allí si deje una imagen y se ve un cuadradito con un signo de pregunta. Me refiero al blog: elenacabejas.blogspot.com. Cariños. María (C)
c No veo ninguna imagen y ningún simbolito en esas entradas... de todos modos, me imagino que de algún modo has roto el enlace de la imagen...no hay que tocar nada más que el número que sale en el último enlace del código de la imagen.
HOLA ROSA!!! CREO QUE LOGRE poner la imagen en tamaño real, SOLO QUE EN VEZ DE PONER ''s00-R'', ME RESULTO PONIENDOLO PERO SIN EL GUION NI LA R. ES DECIR QUE ASI: ''s00'', Y CREO QUE QUEDO . TE HAGO OTRA PREGUNTA RESPECTO A MI BLOG: peliculasantacruz.blospot.com. , SUBI EN UN GAGET UNA FOTO (Los 12 de la Santa Cruz) DESDE la dirección DE PICASA, PUES LA TENIA ALOJADA ALLI. Y se subió BIEN. AHORA VA LA DUDA: EN PICASA HAY UNA nueva función que te permite ponerle nombre a cada rostro de una foto. Se lo pones y cada vez que acercas el cursor a una cara, aparece su nombre. Y lo hice y funciona, pero en PiCASA, una vez que subo la imagen al blog, eso deja de funcionar. Sabes si tiene arreglo? Gracias, María (C)
c Se necesitan una serie de códigos bastante complicados y un script, que además no tengo muy claro si funcionarían bien en Blogger...en cuanto tenga tiempo lo miro.
Gracias por responderme Rosa!!! Cariños, María (c)
hola rosa.. ya lo logre, modificando el 400 por 530 y me dio la medida que nesesitaba, no te hago perder mas tu tiempo y gracias por el tip, saludos mexicanos
Hola Rsa, en blogger in draft no me sale la opción de subir imagenes. En el tablero de escritura solo me salen las solapas de redactar y edición html.
Rosa...gracias por todos tus consejos...levo horas pegada en tu pagina. He rehecho mi blog gracias a tus consejos, pero esto no me ha resultado, pues no me sale eso en HTML...habra otra manera?...gracias de todas formas.
Danae Yo no conozco otra forma, lo siento.
Hola Rosa
soy nueva en todo esto y he descubierto tu blog precisamente buscando información para modificar el tamaño de imágenes. He probado con tu explicación,y perfecto,con la excepción de que sólo sale la parte izquierda de la fotografía,y no el centro,que es lo que más me interesa...¿cómo podría solucionar ésto?
un saludo y felicidades.
coleguita Vamos a ver... si tus entradas tienen un ancho por ejemplo de 400px es imposible que una imagen con un tamaño mayor que ese se vea completa... no hay espacio para mostrarla.
hola pues primero un saludo jeje nada mas para pedir una ayuda no se si valla aqui pero mi problema es que un compa me dice que la entrada de mi blog es angosta como le hago para ensancharla saludos
Shorai-ken
Shorai Ken Ya lo has conseguido ¿no? porque yo no la veo angosta en absoluto y tu plantilla tiene un ancho óptimo para cualquier resolución de pantalla...
Me salvaste la vida, gracias
Que padre, como siempre le ando moviendo hasta que di, ahora se que queda como codigo y se tienen que almacenar las fotos en vez de estarlas subiendo ahi, es mas practi y me evito el esperar a que carguen, muchas gracias Rosita...
Hola Rosa! espero que estes muy bien y como siempre agradezco tu dedicación en el blog y el exelente trabajo realizado.
Te quería hacer una pequeña pregunta relacionada con el tamaño de las imagenes; ¿Se puede cambiar el tamaño predeterminado de las imagenes subidas en blogger?, esto sería por dar un ejemplo, si subo una imagen "pequeña", sea de 200x200, si subo una mediana, de 300x300, si es grande, de 450x450... me refiero a poder cambiar esas medidas en la plantilla del blog (disculpa si mi vocablo técnico es tan pobre, espero me entiendas).
Saludos!! :P
Toxik BoysDesde el editor de Blogger "normal" no, pero si accedes a tu panel desde http://draft.blogger.com/ al subir una imagen a la entrada esta tendrá en su código las propiedades width (ancho) y height(alto) que pueden cambiarse...
Gracias Rosa, ahora mismo lo intentare :D
Hola Rosita nuevamente por aqui, yo quiero saber asi como escribiste: "el tamaño máximo permitido es de 400 pixeles" por defecto de blogger, pues si se podria mejor cambiar el tamaño de donde se basa la plantilla para publicar las imagenes.
Digamos si mi ancho de: main-wrapper lo marca de 600 y me las sube en 400 (suponiendo) cambiarle ese codigo de 400 de alguna parte a los 600 para que cada vez que suba imagenes las pueda guardar al tamaño "nuevo", por asi decirlo, seria mejor si se pudiera cambiar eso... de antemano mil gracias...
Es que he accedido desde Blogger In Draft y creo que no me funciono, ais que no se je je...
© ۞Jair Octavio۞ Desde que esta entrada se publicó, todo cambió en Blogger, hasta el código de las imágenes...
Si accedes desde Draft y usas además el nuevo editor, cada vez que subes una imagen sale una etiqueta con varias opciones, una de ellas es "Extra grande" no tienes más que escogerla para que la imagen ocupe el ancho disponible de la entrada.
Rosa, yo estoy bastante perdida... no entiendo todas las cosas que se comentan por aquí...
Mi duda es que al añadir una imagen a mi entrada, se ve en pequeño, y si le modifico width: 400px; height: 300px; me pierde mucha calidad y se me muy fea...no sé como podría hacer para modificar eso...
Si tienes tiempo, te lo agradecería mucho, sino, no te preocupes!
Felicidades por tu blog tan interesante,
y gracias de antemano!
Un saludo
http://anialonso.blogspot.com/
Ania Alonso Si subes una imagen de 100 x 100 pixeles por ejemplo, es normal que si le aumentas a 400px la imagen pierda calidad, eso pasará siempre...
Se trata precisamente de poder subir una imagen grande y controlar su tamaño en la entrada...
de todos modos, te recomiendo usar el nuevo editor de Blogger y así no tendrás que hacer cambios en ningún código:
http://elescaparatederosa.blogspot.com/2009/09/nuevo-editor-y-avatar-en-comentarios.html
:D Muchas gracias por tu explicación, perfectamente clara, es muy noble de tu parte, cuídate.
Publicar un comentario
Si vas a dejar una consulta, procura tener habilitado tu perfil en Blogger o deja la url del blog a revisar (no enlace).
Los comentarios están siendo moderados.
Comentar con el formulario antiguo