Click here to Skip to main content
Licence CPOL
First Posted 3 Dec 2006
Views 144,400
Downloads 1,190
Bookmarked 89 times

LightBox Web Gallery Generator

By | 7 Oct 2007 | Article
A program to generate HTML Web Gallery based on the LightBox JS

Introduction

LightBox Web Gallery Generator is a small .NET Windows Application that given a folder with images outputs HTML Web Gallery based on the LightBox JS.

Considering that Lightbox Web Gallery Generator has a tiny size and runs without installation, you can download it, run it and have your first gallery ready in a matter of seconds.

Background

I am usually successful at fighting the desire to write a program for each and every task myself. But couple of years ago, I found that none of the existing off-the-shelf packages address my needs. I wanted a very straightforward tool that would allow me to share my photos in a couple of clicks. I needed presentation with maximum screen space dedicated to photo with minimum text. Also I wanted the gallery to serve as a backup and store the original photos along with resized versions.

Online services had gallery images too small for my taste. Dozens of programs I have tested produced galleries just too ugly for me. Almost none could serve original photos. Very few had clean HTML or gave control over CSS. All required numerous clicks to get where I wanted. So to do it right, I had no choice but to do it myself.

The first version created index (thumbnails) page and individual pages for each photo. You can still find this original version here. But once LightBox JS by Lokesh Dhakar gained momentum, I have dumped most of the code in favor of LightBox. The program became more like an add-on to LightBox than an original program, but the result is very pleasing and that's what counts.

Using the Program

When you start the program, you are presented with this screen:

Choose a source folder with *.jpg images, hit "Create web gallery" and in a few moments, an HTML Web Gallery will open in your browser. HTML files and resized photos have been placed into specified folders and you can transfer them anywhere you want.

All of the controls on this main window are obvious. And while this may be all a regular user would ever need to know, for advanced users there are a couple tweaks.

Pressing "CSS" link at the bottom of the form brings a section that allows modifying the CSS for the index (thumbnails) page, giving the user complete control over the page appearance.

"Master Page" link provides a functionality of integrating the gallery into the design of an existing Web site. All you need to do is just to place <%WG%> into the body of any HTML page and the gallery pages will be created based on that page where gallery-specific code is inserted instead of <%WG%>. See integration sample here.

Points of Interest

The project was intended to address a specific set of requirements in the shortest time possible. In addition, I am a Web developer who writes desktop applications only when it cannot be avoided. As such, the code will certainly not win any prizes and will not open any new grounds. The best I can say is that it is simple. As such, I will not be presenting any code in this article; if interested - just look for yourself.

There's a number of features/fixes that could have been easily added to the program like handling of other graphic files besides JPG; handling image subfolders; using something else instead of Microsoft.VisualBasic.Interaction for Registry works; better structuring of the code; having HTML blocks in resources instead of having them hardcoded and much more. But it does what I need it to do just fine, so if somebody needs to improve on it, you've got the source code.

Latest Updates

September 2007

  • Upgraded project to Visual Studio 2005 (it was about time)
  • Added control for resized image quality (thanks to Dmitry A. Mottl)
  • Lightly changed CSS

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

About the Author

Ruslan Sudentas

Web Developer

United States United States

Member



Sign Up to vote   Poor Excellent
Add a reason or comment to your vote: x
Votes of 3 or less require a comment

Comments and Discussions

 
You must Sign In to use this message board. (secure sign-in)
 
Search this forum  
 FAQ
    Noise  Layout  Per page   
  Refresh
GeneralEast Asia fonts doesn't work PinmemberMin Tsao10:10 19 Aug '10  
GeneralRe: East Asia fonts doesn't work PinmemberRuslan Sudentas13:13 22 Aug '10  
GeneralRe: East Asia fonts doesn't work PinmemberMin Tsao13:35 22 Aug '10  
GeneralRe: East Asia fonts doesn't work PinmemberRuslan Sudentas13:54 22 Aug '10  
GeneralRe: East Asia fonts doesn't work PinmemberMin Tsao14:10 22 Aug '10  
GeneralRe: East Asia fonts doesn't work PinmemberRuslan Sudentas4:44 23 Aug '10  
GeneralRe: East Asia fonts doesn't work PinmemberMin Tsao6:23 23 Aug '10  
GeneralNewest source code PinmemberDalePres14:43 9 Jun '10  
GeneralRe: Newest source code PinmemberRuslan Sudentas14:04 22 Aug '10  
GeneralNewbie's question Pinmembereevakk11:07 9 Jun '09  
GeneralRe: Newbie's question PinmemberRuslan Sudentas14:05 22 Aug '10  
GeneralQuestion on css PinmemberPlato_Costa11:57 17 Feb '09  
GeneralRe: Question on css PinmemberRuslan Sudentas7:49 18 Feb '09  
Generalsuggestions Pinmemberchamanmago2:52 13 Dec '08  
GeneralRe: suggestions PinmemberRuslan Sudentas11:47 14 Dec '08  
GeneralRe: suggestions Pinmemberchamanmago15:33 14 Dec '08  
GeneralRe: suggestions PinmemberRuslan Sudentas10:12 15 Dec '08  
GeneralJavascript Transition does not always work. PinmemberIan Eager6:40 19 Nov '08  
Questiontd.tdImg Pinmemberihoskins113:47 18 Nov '08  
AnswerRe: td.tdImg PinmemberRuslan Sudentas3:58 18 Nov '08  
GeneralRe: td.tdImg Pinmemberjuno91212:12 18 Nov '08  
GeneralRe: td.tdImg Pinmemberihoskins115:22 19 Nov '08  
GeneralRe: td.tdImg PinmemberRuslan Sudentas15:49 20 Nov '08  
Hmm, thank you for the images. Without a source code I am a bit puzzled why it worked the way it did. Do you have a link for actual gallery?
AnswerRe: td.tdImg Pinmemberihoskins113:40 2 Dec '08  
GeneralSub-Directories Pinmemberthund3rstruck5:46 28 Sep '08  

General General    News News    Suggestion Suggestion    Question Question    Bug Bug    Answer Answer    Joke Joke    Rant Rant    Admin Admin   

Use Ctrl+Left/Right to switch messages, Ctrl+Up/Down to switch threads, Ctrl+Shift+Left/Right to switch pages.

Permalink | Advertise | Privacy | Mobile
Web04 | 2.5.120529.1 | Last Updated 7 Oct 2007
Article Copyright 2006 by Ruslan Sudentas
Everything else Copyright © CodeProject, 1999-2012
Terms of Use
Layout: fixed | fluid