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>
0 comentarios:
Publicar un comentario