Zoom de las imágenes

El zoom al hacer click sobre las imágenes se consigue con el JavaScript BrighBox que hay que poner en la plantilla justo antes de la etiqueta de fin de cabecera.

<script src='http://sites.google.com/site/bikertb/ficheros-para-el-blog/BrightBox_v2.0_compressed2.js' type='text/javascript'></script>
</head>

El thumbnail (img) de la imagen debe estar encerrado en un ancla (a) con la propiedad onblur definida con el valor que aparece a continuación. El ancla debe apuntar a la imagen ampliada.

<a onblur="try {parent.deselectBloggerImageGracefully();} catch(e) {}" href="http://lh5.ggpht.com/_5SvLLd6obBo/ESRrptIEHNI/s0/Picos_de_Europa-DSC0574.JPG"><img src="http://lh5.ggpht.com/_5SvLLd6obBo/ESRrptIEHNI/s220/Picos_de_Europa-DSC0574.JPG" /></a>

Algunos editores blogger wysiwyg introducen el parámetro onblur con el valor adecuado de forma autómatica, si no ocurre esto, hay que ponerlo a mano.

Este es un pequeño hack que modifica el JavaScript, para que el caption de la imágen ampliada tenga 12pt y una fuente Verdana, Arial o Sans-serif (buscar el código en azul y sustituirlo por el rojo):

imageText.style.fontSize = parseInt(bottomBuffer * 0.3) + "px";

imageText.style.fontSize = parseInt(bottomBuffer * 0.2) + "px";imageText.style.fontFamily = "Verdana, Arial, Sans-serif";

Ejemplo de imagen ampliable:

Puedes encontrar BrightBox en AI projects o coger el mío. No olvides abrir el código y customizarlo.

NOTA: Para las imágenes de los post posteriores a julio de 2011 se empezó a usar Shadowbox.