Using the Lightroom 4 Web module – Part 2

In Part 1 of this series, I looked at the native Lightroom Web module to see if it was usable as a way of constructing a professional web site. To say that it failed to meet my needs would be something of an understatement – it is, frankly, unworthy of the rest of the application.

This time, I’m going to look into a Web module plugin from The Turning Gate (TTG), which should go much further towards creating a good-looking web site. This part is about my early experiences: choosing, installing and getting to know it. Part 3 will be a reflection on my experiences after several weeks of working with the system and trying to set up a real website.

The usual caveat

As before, this is not a how-to guide; it’s a document of my experiences using this software and an account of its usability and fitness for purpose. Some instructional material may accidentally creep in, for which I apologize in advance.

Preparation

TTG plugins cost actual money, so it’s worth checking out what’s on offer and its suitability before forging ahead.

To start with, there’s a lot of choice and it can be a bit bewildering when you first look over the offerings and try to sort out what’s what. Fortunately, there’s a wiki available that, whilst a little bit out of date, is a big help in getting your head around the choices.

Although they’re not presented that way on the main page of the store, the plugins fall into a number of categories, of which the two that interest me are ‘Website Development plugins’ and ‘HTML Image Gallery plugins’.

From the wiki:

Website development plug-ins are used not to create image galleries, but to create the overarching framework in which your galleries will reside. This includes site pages, indexes for organizing your individual image galleries, and even your blog. If you’re building a new site from scratch, these plug-ins should form your foundation, and this is where you should begin.

There’s a hint there: when you first look at the plugin list, you’re tempted to think ‘Hmm, $25. Not a bad price’. Realistically, though, you’re going to need to purchase at least two plugins to construct a viable site.

So, $50-ish. Still not a bad price, but it makes you look more carefully at the individual plugins to ensure you’re getting the right ones. Reading the wiki helps, too, although I would have liked to see a page that really spells out the options and maybe gives some hints on the best combinations for common needs.

The good thing about the TTG plugins is that they all work to a common framework (Common Engine version 2, hence the ‘CE2’ in the names), so they play nicely together and you do get a real sense of being able to mix and match to your specification (and extend later with e-commerce options, should you so wish).

Decisions, decisions

So, I’ve read the documentation and I’ve for a while and then finally settled on two plugins that seem to be the ones I need. The first is TTG CE2 Pages (which I’ll just call Pages from now on) and TTG CE2 Horizon (Horizon).

TTG CE2 Pages

Pages is a framework plugin that provides the starting point for your website. It sets up those slightly-boring-but-necessary peripheral bits like the About and Contact pages. You also get a gallery index page. Note: an index page – it doesn’t create galleries. What it does do is to examine the galleries that you do publish and automatically construct the index page – a neat feature but I just wonder if it’ll have its annoyances, as so many ‘automatic’ things do when they fail to give you that bit of control that you want.

TTG CE2 Horizon

There are several image gallery plugins available. I chose Horizon partly because I quite liked the look of it and partly because the other contender, TTG CE2 Highslide, would have required yet another licence (and associated cost), this time for Torstein Hønsi’s Highslide JS. Yeah, I’m a cheapskate – sue me.

The Horizon gallery is a horizontal-scrolling type gallery that I think looks quite neat (a lot nicer than the standard galleries in Lightroom, anyway).

Commitment

Purchasing and installing the plugins was a completely painless process (if you ignore the actual ‘paying’ part of the process). Put the items in the cart, head off to the checkout, authorize with PayPal and, one email and a download later, they’re on my computer. Installation was simply a matter of unzipping and copying a couple of files (where to is dependent on your OS, but it’s all in the instructions). Restart Lightroom and, bingo!, we’re away.

Oh, f-f-fiddlesticks!

For some years now, I’ve been using a particular naming scheme (I think I got it from this very site) that has served me well. It can be summarized as ‘Date-Custom-Original File Number’.

It turns out, though, that this scheme is not very web-friendly (or, at least, it’s not TTG-friendly), since it uses leading numeric characters. TTG uses the file name to generate certain tags in the code, and these tags can’t start with a numeric character. I could adjust the names on export, but that loses the connection with the original image in Lightroom, so it’s better to have the file names consistent from the outset.

The article in question also contains some other good advice on file naming, so I decided to go ahead and rename all my image files. A daunting task, and one which I doubt I’ll complete any time soon. Lightroom’s renaming facility makes it fairly easy, but you do have to watch out for TIFF (or JPG) files scattered amongst the RAWs. If these have come from the ‘Edit in Photoshop’ command, then they possibly won’t rename correctly, since the trailing ‘-Edit’ on the filename defeats Lightroom’s ability to get the file number. It’s at this point that I wish Lightroom would allow in-place filename editing – for those occasional times when you want to manually adjust a single file name.

Building the framework

There are some pretty clear instructions on initially setting up Pages, so I won’t repeat them here.

Once Pages has done its work, what you get can look pretty daunting:

Small aside: I liked the way it automagically picked up my logo graphic. Presumably because it was there in a LR web gallery when I first created the Pages pages. However it did it, I was quietly impressed. (Later: I think I found out what it does – it notices if you’ve changed the Lightroom identity plate and assumes that is your logo.)

The real ‘arrgh’ moment is when you glance over to the right-hand edge and see how small that scroll bar thumb is – there’s a lot of information to fill in and think about. Fortunately, a substantial proportion of that right-hand column is taken up with good, clear instructions on use. Even so, you really want to read the documentation before diving in.

If you have some images in the filmstrip, Pages will use these to populate the image parts of the generated pages. All the pages are based around image + chunk of text (and an image grid, but more on that later). The instructions (and the wiki) say that you should put the images that you want to use for each page in a specific order, because each page picks its ordinal numbered image. That’s the default, but it looks as if there have been some improvements made, because there is an option in the settings panes for specifying which image to use for each page. You can even re-use the same image on multiple pages.

Anyway, the upshot is that, with a few clicks you’ve got the basics of a pretty good-looking website. And that’s not something to be sniffed at.

Moving on…

The advice given on the TTG wiki is to start at the top of the settings panes and work your way down; and who am I to gainsay the author?

Mind you, I’m a bit of an impatient old goat, and I want to see what this new site looks like in a real web browser so, before getting down to it and tweaking things, I Export… my newly-created web site. This should dump a load of HTML somewhere on my hard disk, which I can then browse in Firefox (other browsers are available).

Except…

Pages dumps PHP files, not HTML, and the browser can’t render PHP without a running PHP server. So, is testing the site locally out of the question? If so, that’s a big downer on the whole process. I’m reluctant to hand my public face over to a piece of software that I’ve hardly been introduced to, and trust it to make me look perfect right out of the gate. I wanna see what it does before I make the site live.

To the web!

I spent a bit of time on Google looking for a way to preview PHP sites locally, and came across a product called MAMP. I later discovered that the TTG wiki does note that Pages generates PHP only, and that it mentions that there are ways to preview your site locally, including WAMP and XAMPP in addition to the previously discovered MAMP. (Note to TTG: make it more prominent, guys!)

I tried out MAMP: it’s simple enough to install (I think MAMP is Mac-only; WAMP is for Windows and XAMPP has multiple OS versions), and it pretty much does what it says on the tin. It would be nice if it didn’t bug you about the Pro version, though. For checking out the website-in-progress, the free version is quite sufficient. (If you don’t want to be bugged, go to your Applications/MAMP Pro folder and run the uninstaller. If you’re like me, you’ll get a ‘privileged action failed’ message and still get bugged.)

Update: I got fed up with MAMP’s nagging and tried XAMPP. One glitch – TTG/Lightroom won’t write to XAMPP’s default site root (and it’s probably not a good idea to bung your stuff there, anyway), so it’s best to configure a virtual host. It sounds scary, but this site (Mac only) contains a step-by-step guide that works (well, it did for me). You can then export to a convenient location and even maintain multiple sites. Windows users should Google ‘xampp virtual host windows’ (or you can click that link and follow the instructions – the locations of the files differ, but the details ought to be the same).

Update updated: then I got tired of XAMPP (can’t remember why, now) and went back to MAMP.

And so here’s a brand-new, untouched-by-human-hand, Pages website exported locally and viewed in a web browser:

So far, so good – this looks much more promising as a viable solution than the plain Web module. There’s still lots to do though – that color scheme has got to go, for a start.

But I see that I’m getting close to my word quota for this episode, so tune in next time for further adventures in the murky world of web site creation.

Graham Douglas – Grey Dog Photography

via X-Equals - Click. Download. Smile. http://x-equals.com/blog/using-the-lightroom-4-web-module-part-2/?utm_source=feedburner&utm_medium=feed&utm_campaign=Feed%3A+xequalsblog+%28X-Equals+%2B+Blog%29