Creating your own engine for Lightroom galleries

I have been pondering creating my own plugin for generating web galleries of my photos for some time but this weekend I took the time! I have been looking around at different solutions and both Highslide Gallery from The Turning Gate and Elegance from Photographer’s Toolbox are both clean and uses CSS and JavaScript. But they both had a number of issues I didn’t like. The main problem with elegance is that someone with a large display cannot really enjoy the photos since they do not scale, and someone on a small screen can’t see the whole photo. TTG Highslide lacked a few other features,no way to change the controls to small white icons instead of text, no way to place the controls above the enlarged image, no numbers in the heading, unable to remove the thumbstrip when viewing the enlarged images and not possible to constrain the size of the popup so it does not resize depending on image.

But HighSlide which TTG HighSlide is based on is extremly re-configurable and you can fix all of those issues. Specifically easy to do since it also has a very nice visual editor!

Though to use my own modified version required me to write my own web engine. It was very easy to get started with the aid of the Lightroom SDK. With the tutorials in the manual one can create a new web engine in minutes. On the other hand it was not that easy to integrate with Highslide. But after a couple of hours I now have a working version which I’m satisfied with at the moment. I used the Highslide editor to create a how I wanted the enlarged photos and navigation to look like. I downloaded the zip file from the editor, copied it into my new lrwebengine folder. Created a new index.html file and copied all from the highslide-custom-example.html into it. All new styles etc I put into a new gallery.css file. Once I had got a look I liked the next step was to take it appart and but into header.html, footer.html and grid.html. 

Then it was bout time to start tweaking the manifest and the galleryInfo files to do what I wanted. One of the things I have not liked with the default galleries is the odd folders they put photos in. But in Lightroom Blog I found out how to control where the web engine store photos.

I ran into some more small problems, related to Lua since I had never written any programs in Lua before. Programming in LUA was useful! Also looking into the LightroomForums.Net was helpful for more Lightroom and plugin related problems.

I have not added support for LiveUpdate yet since that required some more JavaScripting.

Things to improve:

  • change the size of the enlarged photo
  • change the colour of the background for the enlarged photo
  • change font and size for Title, Description, Image number and Caption
  • change number of coloumns
  • change page background colour and thumbnails layout
  • add support for live update
  • add support for facebook comments?

If you want to create your own Highslide gallery or based on some other library you can download my files here. I have not included the Highslide files since they are not totally free and you need to agree to the license before using them.