Implementando Lightbox no Blogspot

Eu passei um trabalho pra colocar o lightbox do jeito que eu queria aqui no blog. Então vou tirar um pouco mais desse trabalho e vou ensinar como eu fiz isso. Porque no fim das contas ficou muito pratico.

O primeiro passo é incluir um gadget de HTML/Javascript. Você faz isso na aba design, elementos da pagina no painel do seu blog. La você vai incluir um novo gadget do tipo HTML/Javascript e vai colar o seguinte scrip dentro.

<script src="http://ajax.googleapis.com/ajax/libs/dojo/1.5/dojo/dojo.xd.js" type="text/javascript"></script>
<style type="text/css">
   @import "http://ajax.googleapis.com/ajax/libs/dojo/1.5/dijit/themes/tundra/tundra.css";
   @import "http://ajax.googleapis.com/ajax/libs/dojo/1.5/dojox/image/resources/Lightbox.css";
</style>
<script type="text/javascript">
dojo.require("dojox.image.Lightbox");
var dialog;
dojo.query('body')[0].setAttribute('class', 'tundra');
dojo.addOnLoad(function() {
   dialog = new dojox.image.LightboxDialog({});
   dialog.startup();
   var images = dojo.query('.lightbox');
   for(var i = 0; i < images.length; i++) {
      if(typeof(parseInt(i)) == 'number') {
         dojo.connect(images[i], 'onclick', images[i], function(event) {
            dialog.show({ title:this.title, href:this.href });
            event.stopPropagation();
            event.preventDefault();
         });
      }
   }
});
</script>

Edit: Eu criei uma versão bem mais elegante que agrega a feature de grupos de imagens no script. Tem um link pro fonte em um dos meus comment, la em baixo!

Lembre de deixar o título do gadget em branco.
Feito! Agora é só incluir a class lightbox no link das imagens nos seus posts. Algum trabalho você tinha que ter né =). Da pra por um título no link pra exibir em baixo da imagem quando o lightbox abrir.

<a class="lightbox" title="Lightbox" href="http://1.bp.blogspot.com/_4ttj6YxZQtQ/TGC5mQCdtgI/AAAAAAAABes/SzDagDjX7_I/s1600/lightbox.jpg">
     <img src="http://1.bp.blogspot.com/_4ttj6YxZQtQ/TGC5mQCdtgI/AAAAAAAABes/SzDagDjX7_I/s320/lightbox.jpg">
</a>

Eu optei por dojo, caso você pergunte, pois ele não depende de nenhum plugin pra fazer todo o serviço. Eu cheguei a testar com o jquery mas não existe CDN pros plugins. E CDN é ótimo para os pé rapados como eu que não tem seu próprio servidor pra hospedar os js.