¡Hola lectoras tras la pantalla!
Hoy os cuento un secreto. Uno que solo las mejores blogueras conocen, uno que hará vuestro blog más bonito y llamativo, uno que a lo mejor cuando os lo cuente me diréis "¡pero si ya lo sabía!" :-P. Pero el caso es que como yo me he enterado hace poco, os lo cuento ahora.
Decidme, ¿no os habéis preguntado nunca por qué algunos blogs de Blogger tienen unas imágenes supergrandes y superchulas en sus posts mientras que en los nuestros las imágenes, aunque las pongas al tamaño máximo, aparecen más pequeñas?
La razón es muy simple: aunque Blogger solo te deja usar cuatro tamaños diferentes para las imágenes (pequeño, mediano, grande y extra grande) podemos usar otros muchos tamaños simplemente editando el html de la entrada. Y creedme, es muy muy sencillo.
También podéis usar el tamaño de la imagen original. Así que otra opción sería cambiar la imagen al tamaño deseado con algún programa de edición fotográfica y subirla. Pero si queréis que una vez publicada la entrada, al pinchar el lector en la imagen aparezca la imagen aún más grande y con una buena resolución, con esta opción esto no lo podéis hacer. Por eso que este método a mí no me gusta.
Os explico "mi" método con un ejemplo. Me ha gustado esta bonita foto del teatro romano de mi ciudad (Cartagena) que tomé cuando estaba de vacaciones. La imagen original tiene una resolución de 1500x1000 píxeles.
Si incluyo la imagen en la entrada usando la opción extra grande, que es lo que solía hacer, Blogger añade la imagen con el siguiente tamaño:
Que como veis... no aprovecha todo el ancho de la página. Es decir, el tamaño más grande que te permite Blogger no es suficiente y si elegimos el tamaño original, al ser la imagen más grande que el ancho, el blog se descuadra.
Ya sabemos que en esta vida, todo lo que se puede solucionar lo solucionamos. Y lo que no, no tiene que preocuparnos. En este momento nos encontramos en el primer caso. Genial, ¡tiene solución! :) ¿Qué podemos hacer? Para aumentar el tamaño tenemos que:
En el ejemplo de abajo he sustituido el s640 por s800 ya que mi ancho de página es de 900 píxeles. Lo que hacemos cambiando ese número es especificar el valor de la dimensión más grande (ancho o alto) de la imagen, la otra se ajusta sola proporcionalmente. Es importante que mantengáis la "s" para que el código html sea correcto.
El código resultante es el siguiente:
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoY4E8WRNRdCa_Ki6mtp0ZoDhgdl6HFTXLNebu6jH8dMwMkb-H5771j09FeuFEfIse3ToNDp_3MWCsp0-Mx0Sx-S8l99mB0TushIEAGM0bybuFp6Wu5FjTy46PW7-ftzTDg_pJjk841cE/s1600/teatro+romano+de+cartagena.JPG" imageanchor="1" style="margin-left:auto; margin-right:auto;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoY4E8WRNRdCa_Ki6mtp0ZoDhgdl6HFTXLNebu6jH8dMwMkb-H5771j09FeuFEfIse3ToNDp_3MWCsp0-Mx0Sx-S8l99mB0TushIEAGM0bybuFp6Wu5FjTy46PW7-ftzTDg_pJjk841cE/s800/teatro+romano+de+cartagena.JPG"/></a>
Podéis especificar el tamaño que queráis ya sea grande o pequeño. Pero, claro, el tamaño máximo vendrá determinado por la resolución de vuestra imagen. No podréis usar una resolución más grande que la imagen original.
La razón es muy simple: aunque Blogger solo te deja usar cuatro tamaños diferentes para las imágenes (pequeño, mediano, grande y extra grande) podemos usar otros muchos tamaños simplemente editando el html de la entrada. Y creedme, es muy muy sencillo.
También podéis usar el tamaño de la imagen original. Así que otra opción sería cambiar la imagen al tamaño deseado con algún programa de edición fotográfica y subirla. Pero si queréis que una vez publicada la entrada, al pinchar el lector en la imagen aparezca la imagen aún más grande y con una buena resolución, con esta opción esto no lo podéis hacer. Por eso que este método a mí no me gusta.
Os explico "mi" método con un ejemplo. Me ha gustado esta bonita foto del teatro romano de mi ciudad (Cartagena) que tomé cuando estaba de vacaciones. La imagen original tiene una resolución de 1500x1000 píxeles.
Si incluyo la imagen en la entrada usando la opción extra grande, que es lo que solía hacer, Blogger añade la imagen con el siguiente tamaño:
 |
| Imagen de 640x426 píxeles |
Que como veis... no aprovecha todo el ancho de la página. Es decir, el tamaño más grande que te permite Blogger no es suficiente y si elegimos el tamaño original, al ser la imagen más grande que el ancho, el blog se descuadra.
Ya sabemos que en esta vida, todo lo que se puede solucionar lo solucionamos. Y lo que no, no tiene que preocuparnos. En este momento nos encontramos en el primer caso. Genial, ¡tiene solución! :) ¿Qué podemos hacer? Para aumentar el tamaño tenemos que:
- Acceder al HTML de la entrada
- Ir al código de la imagen, borrar los parámetros de height y width, y cambiar el valor del tamaño que aparece en la dirección http de la imagen de vista previa por el valor que queramos. Es decir, borrar el texto en rojo del código que veis aquí abajo, y cambiar el número en verde por el tamaño que queráis.
En el ejemplo de abajo he sustituido el s640 por s800 ya que mi ancho de página es de 900 píxeles. Lo que hacemos cambiando ese número es especificar el valor de la dimensión más grande (ancho o alto) de la imagen, la otra se ajusta sola proporcionalmente. Es importante que mantengáis la "s" para que el código html sea correcto.
|
| Imagen de 800x533 píxeles |
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoY4E8WRNRdCa_Ki6mtp0ZoDhgdl6HFTXLNebu6jH8dMwMkb-H5771j09FeuFEfIse3ToNDp_3MWCsp0-Mx0Sx-S8l99mB0TushIEAGM0bybuFp6Wu5FjTy46PW7-ftzTDg_pJjk841cE/s1600/teatro+romano+de+cartagena.JPG" imageanchor="1" style="margin-left:auto; margin-right:auto;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhoY4E8WRNRdCa_Ki6mtp0ZoDhgdl6HFTXLNebu6jH8dMwMkb-H5771j09FeuFEfIse3ToNDp_3MWCsp0-Mx0Sx-S8l99mB0TushIEAGM0bybuFp6Wu5FjTy46PW7-ftzTDg_pJjk841cE/s800/teatro+romano+de+cartagena.JPG"/></a>
Podéis especificar el tamaño que queráis ya sea grande o pequeño. Pero, claro, el tamaño máximo vendrá determinado por la resolución de vuestra imagen. No podréis usar una resolución más grande que la imagen original.
Eso eso todo, ¡espero ver a partir de ahora imágenes superchulas y supergrandes en vuestros blogs! Recordad que podéis visitar las otras guías publicadas en el blog pichando en la etiqueta de tutoriales.
¡Besotes y a disfrutar del fin de semana que ya lo tenemos casi aquí!
¡Besotes y a disfrutar del fin de semana que ya lo tenemos casi aquí!
:)
:(
;)
:P
:D
:/
:x
:*
:O
:S
:|
B)
:w
:a
:))
:((
O:)
7:)
7:P
X(
(:|
=))
I-)
2:P
=DD
X_X
:!!
:q
^_^
:ar!
Ohhh que genial, ahora mismo me pongo con mis imagenes que salen mucho mas chulas así.....muchas gracias Mónica, eres un genio!!!!!
ResponderEliminarun besete
¡Un placer! Así las imágenes se ven muuuuuuuuucho mejor :-). Yo a partir de ahora lo usaré para que salgan grandotas.
Eliminar¡Besotes y a disfrutar del fin de semana, que acaba de empezar!
=DD muchísimas gracias por este truco Mónica. Siempre las pongo en extra grande, pero no me ocupaba el ancho del blog. Ahora probaré en las siguientes entradas con tu truquete :)
ResponderEliminarGracias de nuevo ;)
Gracias por compartir,no lo sabia!
ResponderEliminarQue gran idea, en mi blog que las imágenes son muy importantes me va a ven. me quedo por aquí y te sigo que tienes unas grandes ideas
ResponderEliminarBesos
Raquel
.ir muy bien.
Muy práctico, muchas gracias!! ;)
ResponderEliminarMe parece muy interesante tu blog y creo que puedo aprender mucho.
ResponderEliminarMe hago tu seguidora.
Saludos
Voy a probarlo porque me parece genial que se queden más ajustadas a los lados. Por cierto, vengo del blog de Blanca y muy buen post. Un beso =DD =DD
ResponderEliminar¡Me encantan los trucos, tanto el de la imagen, como los emoticonos! =DD
ResponderEliminarCreo que los voy a poner en mi blog también
Besos
Muchas gracias por contarnos trucos. Yo tambien vengo del blog de Blanca. Besos
ResponderEliminarTienes unas entradas estupendas, nos ayudarán un montón a todos los que comenzamos :*
ResponderEliminargracias gracias!!! siempre quise poder ver mis fotograafias mas grandes y lo logre con tu ayuda!! excelente!!!
ResponderEliminarMil gracias, ya lo aplique a mi blog y mis proximos post se verán mucho mejor , claro en mi caso no le puse un tamaño al ancho sino que le asigne el weight= 95% para que mif fotos queden al 95% del ancho de mi blog, http://negociosymoda.blogspot.com/
ResponderEliminarno se si leas mi mensaje te queria agradecer este post me ayudo muuuchisiiiiiiimo gracias muy facil de entender!
ResponderEliminarmuchas muchas gracias por compartirlo!! es muy util! :)
ResponderEliminarMe podrías ayudar en como aumentar la imagen de perfil como la tienes tu asi en redonda y mas grande?? Es que no lo encuentro en ningun lado!! Espero tu respuesta y Gracias
ResponderEliminarUfff me has ayudado siempre quise ver como poner mis imágenes grandes y no daba con ello... Gracias chica... Te sigo a partir de este momento... Abrazos desde New Jersey
ResponderEliminarJusto lo que estaba buscando!!!!!! Muchas gracias ☺
ResponderEliminarAunque hubiera preferido algo que me lo haga automaticamente ajajajjaajajaja
Muchas gracias por compartir, muy bien explicado y muy util!
ResponderEliminarHola, llevo desde hace 1 año con este truco porque lo miré aquí y me iba genial pero ahora, desde hace 1 mes, cuando aumentas el tamaño se desenfocan, y no es un problema de calidad. Que puedo hacer?
ResponderEliminarjaja como que me entero recién y me sirvió de mucho, gracias!
ResponderEliminarGracias! Y yo vuelta loca buscando hasta que te encontré!
ResponderEliminarBesitos y pásate por mi blog si quieres y así ves mi clase hecha jaja
Vikki
www.vikkipetiteblog.blogspot.com.es
Gracias linda eres super chevere me salvaste ya me había dado por vencido mumumumuuchaaaaaaaaaaaaaaas gracias.
ResponderEliminarBravo!!! Muuuuuuchas gracias por esta perfecta solución!! Cuántas vueltas le he dado yo a este asunto y tú lo has resuelto enseguida!!!!!!! Un saludo.
ResponderEliminarguaaauuu !!! muchísimas gracias, esto realmente me sirvió un montón :) Le estaba dando demasiadas vueltas a lo del tamaño
ResponderEliminardisculpa. como accedes al html de la imagen?
ResponderEliminarHola, cuando estas escribiendo o editando la entrada a un laso arriba debajo del titulo pone HTML
EliminarSuper útil, muchas gracias
ResponderEliminarGracias por el post...
ResponderEliminarahora tengo que editar un quintillón de imágenes... 2:p
Mil gracias!!!!
ResponderEliminarEstuve mucho tiempo lidiando con esas limitaciones de blogger! Argh, casi me arranco los pelos porque me pone esos tamañitos de imagenes tan chimbos, uno no aprovecha todo el ancho como se deberia... gracias de nuevo por el tip!!!