This article was written on October 25, 2007 by CyberNet.
Tutorial Thursday
One of the hot new ways for viewing photos is using a JavaScript technique called LightBox. I’m sure you’ve seen it before on sites where you click on a thumbnail, and a fullsize version of the image is superimposed on the page that your viewing. It then grays out the background so that it’s easy for the viewer to focus on the image. Here’s a working example of LightBox that demonstrates the feature.
Personally I’ve never been a big fan of LightBox, but there are a lot of people who swear by it. When I came across a free program called LightBox Web Gallery Generator, I knew it would be an extremely handy tool for many of you.
What’s so great about it? Not only is it open source, but you also don’t have a thing to install. Once you download the LightBox Gallery Generator you can start working with it immediately!
–Basic Settings–
When you launch the app for the first time, you’ll notice that it’s extremely simple, and there isn’t much you can configure. It’s important to know that the LightBox Gallery Generator will only work with JPG images, but that’s the format that most cameras use so you shouldn’t have any problems.
You’ll want to select the folder with the images, and the folder that you want to output the gallery to. The program will generate thumbnails for all of the images and align them to a grid with however many columns and rows you specify. If you have more photos than can fit on the page it will show next/previous buttons on the generated site as well as page numbers.
The “Image” section in the program is used to specify what the dimensions are of the photos that are shown when the thumbnails are clicked on. By having them resized it helps cut back on the bandwidth needed especially when the original image is gigantic! You can always provide a link to the original image by checking the “Add link to hi-res image” option.
–Advanced Settings–
At first I didn’t really realize that the program had any advanced settings because the text links at the bottom looked like they were hyperlinks for a website. When I clicked on one of them it actually expanded the program’s window to show more settings that you can change to truly customize the look and feel of the gallery that is generated.
The “CSS” option is used to specify your own custom styles to the site. This is where you can customize border, background colors, font types, and more:
At the top of the gallery is a breadcrumb trail that visitors can use to navigate to other pages on your site. This is where you can specify your own custom homepage link or turn it off all together:
The “Master Page” option is truly the heart and soul of the LightBox Gallery Generator. You can create your own custom HTML template to be used with the galleries that you generate. How’s that useful? It means you can put your own header, footer, and sidebars on the site with the gallery being placed in the center of it all.
–The Result–
**drum roll** The end result is what you’ve worked so hard for, well, I use the term “work” loosely. The screenshots below are from a gallery that I generated in under a minute after starting the program up for the first time. The one on the left shows what the thumbnail gallery looks like complete with navigation links, and the one on the right is the “fullsize” image that visitors are shown when a thumbnail is clicked.
If you chose to include a link to the high resolution images you’ll see that next to the title of each photo:
This program doesn’t quite stack up to the JAlbum software in terms of configuration options, but this is definitely the simplest gallery generator that I’ve ever used. If you need to quickly create a photo gallery with some pizzazz I don’t think there is a better option.
LightBox Web Gallery Generator
Copyright © 2014 CyberNetNews.com
Post a Comment