How to modify the large photo page from the example file provided by Adobe to include the title and description of the photo

This is the second section of my notes on building a custom web gallery for Lightroom. It was last modified January 2013 and relates to Lightroom 4.3.

Go to the Table of Contents to see all available sections.


To begin, an aside - I found a handy forum with notes on custom web galleries. http://www.lightroomforums.net/showthread.php?1711-Custom-Web-Gallery-Questions . As I find things, I'm just going to include them in these files. At some point I might organize them, but for now these are more or less my raw notes, so I'll just throw them in where I find them.

So the file large.html is the file we're interested in modifying here. Right now it has some random stuff in it, intended to demonstrate some special variable handling. If you have line numbers, this is large.html lines 57-59.


<xmpl:<aQuote><You <know <what <they <say:<<br>

	<<xmpl:<saying> <<br />....how interesting!<br />/<xmpl:<saying>

</xmpl:aQuote>

I'm not going to fiddle with this stuff right now - I'm sure it has some uses, but I'm not sure what that is
just yet.

To get some additional hints for how to do things, I'm going to go to
C:\Program Files\Adobe\Adobe Photoshop Lightroom 4.3\Shared\webengines\default_html.lrwebengine
and look at the detail.html page, because I'm pretty sure that displays the title of the image.
Sure enough, there it is: $image.metadata.title.

Found a useful article tho not for this:
http://forums.adobe.com/thread/359743

So once I found the variable I needed, I simply added

$image.metadata.title
to the large.html file. Which... did not work. I got 'nil' on every page. I tried changing that to
description from title, and that got me nil as well.

I figure we must need to define this stuff somewhere, so I headed to galleryinfo on the default html
page, and there were some title definitions:

		["perImageSetting.description"] = {
			enabled = true,
			value = "{{com.adobe.caption}}",
			title = LOC "$$$/WPG/HTML/CSS/properties/ImageCaption=Caption",
		},
		["perImageSetting.title"] = {
			enabled = true,
			value = "{{com.adobe.title}}",
			title = LOC "$$$/WPG/HTML/CSS/properties/ImageTitle=Title",
		},

So I'm going to try these in my galleryinfo - in the model section, specifically.
Once I did that, the description and title show up as expected.

I did a bit of hunting once I saw that $$$ business - I figured that would help me find information on
more stuff I could do. It turned up this post

http://forums.adobe.com/message/4199852?tstart=0

which includes some handy metadata references that you might want to include (though I don't think I want to).

$image.metadata.keywords 
$image.metadata.title
$image.metadata.copyright
$image.metadata.location
$image.metadata.isoCountryCode
$image.metadata.city
$image.metadata.state
$image.metadata.country

Which the post notes you must first include in the model, using the same insane syntax as above. E.g.

		["perImageSetting.keywords"] = {
			enabled = true,
			value = "{{com.adobe.keywords}}",
			title = LOC "$$$/WPG/HTML/CSS/properties/ImageKeywords=Keywords",
		},
 

Next Section - Three: How to add a 'Like' button to our custom Lightroom web gallery