EOS template and Photo Mechanic

General • Installation • First Gallery • Part 2 »

General

The EOS HTML template can be used with Photo Mechanic version 4.5 or higher.

Before you start using the EOS template you should get comfortable with generating HTML galleries in Photo Mechanic.

If you have a specific question regarding the application itself (not EOS related) then please post to the Camera Bits support forum. It is monitored by the developers.

Installing the Template

The installation requires two steps and is very simple. All you have to do is to download two ZIP files and extract their content in the right place.

The files are named eos_common_v25.zip and eos_v25_pm.zip and can be downloaded from the Yahoo! group's Files section. It's important that their folder structure is still intact after the extraction!

Common Files

Now you have two folders named "galleries" and "EOS". The first one is your EOS project folder and can be moved to wherever you like. It only contains the "eoscommon" folder. Later it will be the place where all your web galleries reside. There is more information if you click the link above but it is not essential that you read it before you create your first gallery. Example setup:

C:\www\galleries\

Template Files

The next step is to install the "EOS" folder. I suggest to put it anywhere you like, maybe in a parent folder called "my pm templates" or something like that. Then go to Photo Mechanic and select Edit → Preferences... → Files tab and enter the path to the template folder in the last field as shown below.

Note that you can rename the EOS folder without affecting its functionality. That means you can install multiple versions of the EOS template if you like. However it is recommended to change the template name in the source code to distinguish between multiple templates. To do that open the file template-main.rb in a text editor and search for the line containing "template name shown in dialog list box". The name can be found in the line below.

The file template-main.rb is the heart of the template. It gets scanned by the HTML exporter, variables get replaced and rules will be applied to build a complete web gallery.

Template File Type	File name in the Template Folder	File name(s) in Output Folder	Amount
frame	template-main.rb	index.html	1
index	template-main.rb	index2.html	1
image	template-main.rb	page<number>.html or <image name>.html ¹	one per image

¹) Depends whether you have selected "Use original filenames for images".

In Photo Mechanic all index and image HTML files are generated using only one template file, the template-main.rb. All static files reside in the subfolder "eos_files" and get copied unchanged to the output folder.

Your first Gallery

The installation is now completed and you can generate your first gallery. Select the images you would like to appear in the web gallery and then start the Exporter:
File → Export... or simply with Ctrl+Alt+x.

Once the Exporter window opens choose "EOS" as your Selected Template as shown in the image below.

The JPEG Quality should be set to a low value, otherwise the file size gets too big. The quality is still excellent at 20%!

Subsampling Chroma is an usual compression method to reduce file sizes. In Photo Mechanic you should always check Subsample Chroma because there is no visible loss of quality and the image files are about 20% smaller.

Note that a JPG quality value of 20% (with Subsample Chroma enabled) results in file sizes which are equal to an 80% setting in BreezeBrowser or High quality in iView MediaPro or a 90% setting in JAlbum! Of course, the quality is the same. Set higher values only if you want ultimate quality and if don't care about large files.

Sharpen images is a must. There is no reason to uncheck that option.

It is recommended to check the option Convert to sRGB color space if you plan to put the images on the web. Note that browsers on PCs are not color managened. They expect sRGB images.

If you use original filenames for images is up to you. It is usual in other tools.

Reusing existing images is a time-saver if you regenerate a gallery. See the next part for more information.

If you mark Open in browser the gallery will be loaded in your default browser after the generation is complete. Note that the gallery will fail to load if the eoscommon folder is missing or not at the expected place.

Now let's have a look at the right area of the window.

Here you can enter values for the Gallery Title and a Gallery ID. The latter is an optional code which will appear in the order logfiles. It is invisible to your client but can be used to group your orders. One day you scroll through a list of your orders and might want to sort them by event date (for example). That's what this field is for.

The Header Height can be left at 60 pixels. Change it only if you plan to use a larger logo image in the top frame.

Furthermore you can set the max. width and max. height for the thumbnails and the main images.

If you want to show image descriptions you can set the Caption Source field here. The value "{caption}" as shown in the screen shot will be replaced by the content of the IPTC caption field of each image during the HTML generation process. Leave this field empty if you don't want to show additional information.

Note that if you mark Preserve EXIF or Preserve IPTC it will increase the file size of your images. It is not necessary to include this information for the EOS template.

Adding a Watermark to your images is a very good way to protect them. Embed your name and/or website in the image for a visual reference. Below you can see a setting that gives a nice result.

Once you are done with all settings hit the Export button and select or create the Output Directory (or destination folder). That is an important step! Select or create the EOS project folder plus a gallery folder name of your choice. In our example that would be C:\www\galleries\event01.

In other words, "C:\www\galleries" is your EOS project path, where the "eoscommon" folder sits and all your web galleries as well.

Now click on OK and start the process. The gallery will be shown in a new browser window if you have selected Open in browser. Otherwise you need to navigate to your output folder and double click on the file index.html.

What's next?

Locate your EOS project folder, named "galleries" in the example, and upload it to your website. If you place it in the top folder on your web server then you can access it with your browser using an address like this one:

http://www.mywebserver.com/galleries/event01

Once you got that far you can r e l a x . From now on we are able to support you over the web and clean up any mess you might have made during the customization process...

The next step is to explore the EOS settings file in the "eoscommon" folder and make some simple changes. Read the customization intro for more information. Reload the gallery in your browser to see your changes and you're right into the customization process. Note that there are some very helpful scripts in the "help" subfolder. It's also a good idea to have a look at the FAQ (only for clients). It's highly recommended that you read the first entries, marked with BEGINNER. It will save you a lot of time in case you have to deal with a script error.

Part 2 of the Getting Started article will show you how to control the EOS template with IPTC metadata.