I’ve been making this website a bit more to my liking every week. This week I decided to look into the possibility of integrating my Picasa web albums with this journal. How little did I know what I would get myself into.
Eventually, I made it all work as I originally had in mind. It took a couple of days to get there though. First off, I needed something that would make it easy for me to insert photo albums from Picasa into posts or pages. I quickly found there are some pretty decent plugins available. I settled on using Picasa Express x2
So far, so good.
Until I created my first page.
The horror began when I previewed my work. The results weren’t quite what I had in mind! The first thing I noticed was that the galleries I had inserted only showed two thumbnails on the same row, while it clearly looked as if there was sufficient room for three. It looked downright silly to have a whole bunch of rows underneath each other while a sizeable portion of the page was left with white, unused space.
Grumbling to myself I fired up my beloved Firebug – any self respecting web developer should have this tool – and started to poke around a little to see if I could free up a few pixels in the layout to neatly fill out the page. Eventually, I found I could adjust the margin of a linked image element by five pixels to nicely fill out the available space.
Satisfied, I stumbled upon my next nightmare. I found I could click on the thumbnails. Unfortunately, the linked image opened in the same window. I thought to myself: “No biggie! I’ll just go look for a Lightbox plugin!” This is where the real trouble started. There are quite a lot of Lightbox plugins available, so I thought I would quickly be able to fix things up! However, none of them seemed to want to work! Grrr!
My frustration grew when I found out other themes had no trouble at all with displaying the Lightbox! After some googling I found that Monochrome, the theme I’m using, is based on JQuery. So… I had to find a plugin providing a JQuery implementation of Lightbox. Fortunately, there are a few of those as well. Unfortunately, not all of them worked as intended. I don’t know why I was still surprised to discover this; one didn’t work correctly with Internet Explorer, another refused to work in combination with the earlier mentioned Picasa plugin.
Finally, I found the correct combination of plugins. It allows me to use Lightbox on my website, it works seamlessly with the Picasa plugin and as far as I’m aware it behaves correctly in all browsers. It appeared I needed the JQuery implementation of Simplebox. The downside to using this plugin is that it doesn’t automatically scale down images to screensize when they don’t fit. I don’t quite like this, but I suppose I will have to settle with having to work around this by making sure I don’t use over-large images.
At least the positive side of this is that I learned a lot more about WordPress, Monochrome, Lightbox and JQuery.
