Lightbox 2.0 Web Photo Gallery

Start by duplicating the “Simple” preset folder (or the “Lightbox” folder if you created one already) in your [Presets > Web Photo Gallery] folder. Rename the duplicated folder to “Lightbox 2.0″ and create a folder within that called “images”. Visit the Lightbox JS v2.0 website and download the necessary files. Drag the supporting Lightbox 2.0 images, stylesheets and javascript files (from your download) into the “images” folder.

Open the [Thumbnail.htm] file, located in the “Lightbox 2.0″ folder, in your favorite HTML or text editor. Set the anchor tag to:

• <a href="%IMAGEPAGE%" title="%CAPTIONTITLE%" rel="lightbox[gallery]">

Open the [lightbox.js] file, now located in the “images” folder. Find line (approximately) 331 where it says

• imageArray.push(new Array(imageLink.getAttribute(‘href’), imageLink.getAttribute(‘title’)));

And add/change that line to:

• imageLink.href = imageLink.getAttribute(‘href’);
• imageLink.href = imageLink.href.replace("/pages/","/images/");
• imageLink.href = imageLink.href.replace(".html",".jpg");
• imageLink.href = imageLink.href.replace(".htm",".jpg");
• imageArray.push(new Array(imageLink.href, imageLink.getAttribute(‘title’)));

Then find line (approximately) 343 where it says:

• if (anchor.getAttribute(‘href’) && (anchor.getAttribute(‘rel’) == imageLink.getAttribute(‘rel’))){
•  imageArray.push(new Array(anchor.getAttribute(‘href’), anchor.getAttribute(‘title’)));
• }

And add/change to:

• if (anchor.getAttribute(‘href’) && (anchor.getAttribute(‘rel’) == imageLink.getAttribute(‘rel’))){
•  anchor.href = anchor.getAttribute(‘href’);
•  anchor.href = anchor.href.replace("/pages/","/images/");
•   anchor.href = anchor.href.replace(".html",".jpg");
•  anchor.href = anchor.href.replace(".htm",".jpg");
•  imageArray.push(new Array(anchor.href, anchor.getAttribute(‘title’)));
• }

A little below that, you’ll want to find:

• while(imageArray[imageNum][0] != imageLink.getAttribute(‘href’)) { imageNum++;}

And change it to:

• while(imageArray[imageNum][0] != imageLink.href) { imageNum++;}

Save your edited [javascript.js] file. Run your new Web Photo Gallery through Photoshop.