However, I just felt that the user experience was damn lousy in that way. In particular, it is very disturbing to see new windows being opened or new pop up appearing to show the photo elsewhere. That gave me a feeling of lost of connection from the main website.

LightBox Photo Display Javascript

I search online trying to look for some idea or solution to improve user experience. I found a very cool photo gallery display javascript called LightBox. It allows a photo to be enlarged and displayed right at the center of the screen upon a single click on the thumbnail. On top of that, the background will also be dimmed down to make the photo standing out. It also included some basic “Previous” and “Next” buttons to scroll between all the photos in the same gallery without opening up all the disturbing windows or pop up.

The set up is not very complicated and quite straight forward. You simple need to download the script files, upload it to your server. Personally, I put it under my wordpress theme directory. An instruction is provided in the ZIP file that comes with the script. Follow the instruction to add javascript and CSS headers into your theme files.

If you are familiar with PHP, you can disable the default WordPress gallery setting and modify it to use Lightbox. Programming is just not my cup of tea. I utilized a WordPress Plugin called Cleaner WordPress Gallery for setting up the wordpress gallery for me.

After which, I was done!!! Open up the gallery @ KokPinLab.com and I have my lightbox working… *Happy*… hehe…

Lightbox Photo Display on KokPinLab

Lightbox Script Download

You can download the Lightbox script at: http://www.lokeshdhakar.com/projects/lightbox2/