Tutorial | June 2009 | M.McKennedy
example photo gallery - click for a larger view
Let me guess, you are a website designer (or aspiring to be) and you want an easy way to manage/create online photo galleries? It’s your lucky day because I have a very simple solution for you using Google’s Picasa and a plug-in called ‘SimpleViewer’. The best part about all of this is that installing and using these nearly automated photo gallery creation tools is 100% free and really easy to do. Read on…
Note: This tutorial assumes that you have a web host and you have some working knowledge of website design and HTML. For a preview of the kind of image gallery I am talking about take a look at the May 2009 version of my ‘Things I Saw’ Photo Galleries. Or take a look at all the galleries here.
First things first: If you are not familure with Picassa – take a look at this free download page. Download and install Picasa and play around with it. You can edit, organize, and if you don’t have your own website you can upload to a free online photo album – (Picasa Web Albums provides 1 gigabyte of free storage) and share these photos with your friends and family but you will not be able to customize the photo viewer template.
Second: Download and install SimpleViewer (it’s a free, customizable Flash image viewing application – you do not need to know any Flash what-so-ever!)
Third: Open Picasa. Select the images you want to make a gallery from (to select multiple images you can hold down the CTRL key as you select each image, or to select a group of images click the shift key and select a range of images), and click Folder -> Export as HTML Page… Select your image size and gallery title. In the Select a Web Page Template page, select SimpleViewer. Click Finish. The gallery will be generated and displayed in a new browser window. Captions added in Picasa will show as captions in SimpleViewer.
Fourth: After the HTML page has been exported you can make adjustments – to adjust the number of rows and columns for the thumbnail version of the images you will need to open (using the HMTL or text editor of your choice) the auto-generated file called gallery.xml. In this file you will find two editable variables (plus more) – thumbnailColumns=”3″ thumbnailRows=”4″. Change the numbers to the values of your choice and save the file. Just keep in mind that if you change thumbnailRows to “40″ the template might not look so good!
Other photo gallery template options
TiltViewer example - click for a larger view
TiltViewer - is my next choice of free online photo gallery templates. TiltViewer is a customizable 3D image display template. Images can be flipped to show a description text and an optional link. Designed to provide a fun, intuitive user experience. If you are looking for something a bit more flashy than SimpleViewer, TiltViewer should be your choice. – to install, follow the same instructions as for SimpleViewer. Click on the image on the right to view a sample of the photo gallery or take a look at my Things I Saw photo gallery from April 2009 for a working example. There are also other image viewers AutoViewer, and PostcardViewer.
Online photo galleries can be both simple and free using Picasa and the terrific Flash based templates created by Airtight Interactive.com. With a little bit of HTML (Hyper-Text Markup Language) and CSS (Cascading Style Sheets) experience you can have your images displayed in an visually impressive online gallery in just a few simple minutes.
