Topic : Tip: Customising Web Galleries

Topic Archived This topic has been archived - replies are not allowed.




            Permlink
            Replies : 7 - Pages : 1 - Last Post : Jan 16, 2006 3:32 PM by: Tom Rockwell
Ian Wood


Posts: 2,819
From: UK
Registered: Jan 12, 2005
Tip: Customising Web Galleries
Posted: Dec 7, 2005 5:51 AM

This is only for those of you who know HTML and CSS fairly well...

Control-click on the Aperture application and choose 'Show Package Contents'. In the new Finder window navigate to Contents/Resources/English.lproj/WebThemes/ and you will find a series of folders, one for each web theme.

Duplicate the folder for the theme you want to base your edited version on, and give it a suitable name. This name is what will appear in the theme list in Aperture.

Bits we are interested within this folder:
detail.html - this is the template for individual images pages.
journal.html - template for main journal pages.
gallery.html - template for main gallery pages.
journal-gallery.html - combined template for main journal and gallery pages.
assets/css/global.css - overall CSS file - edit this for different font families etc.
assets/css/white.css - only in Art Collection theme.
assets/img/ and a series of gifs for the navigation arrows.

If you open one of the template files in Safari you will see a whole series of placeholder texts such as 'Image _PageNumber_' - what these are replaced with is relatively easy to work out if you open up the same theme page in Aperture and compare.

_PageNumber_ = number of current image
_PageCount_ = total number of images
_metavalue_ = whatever metadata you decide to add
_metaname_: _metavalue_ = name of metadata category, ;, value of that metadata

Open the HTML file you want to edit in an HTML editor such as Dreamweaver, or just a text editor if you know your way around HTML.
To remove the irritating 'Image plus a number' or 'Plate plus a number' bits just delete 'Image _PageNumber_' or 'Plate _PageNumber_' as appropriate, and save the file.

To add logos or links, just add them as normal. Images can be either be added to assets/img/ or you can put in a hard link to an image already on your server.

Unaltered Stock theme:
http://azurevision.co.uk/aperture/frost/

Edited Stock theme - logo at top of pages is also a link:
http://azurevision.co.uk/aperture/frost-theme/

If you get into further experimentation, the HTML files contain lots of instructional comments. For true professionalism, make a screenshot of your gallery and overwrite the thumbnail.tiff file to get the proper thumbnail in the theme chooser:
http://azurevision.co.uk/aperture/theme-chooser.jpg

Ian

G5 2x2GHz, PB 1GHz 15   Mac OS X (10.4.3)  
tselim

Posts: 38
Registered: Aug 20, 2005
Re: Tip: Customising Web Galleries
Posted: Dec 7, 2005 2:16 PM   in response to: Ian Wood

Thanks for taking the time to share this!

  Mac OS X (10.4.3)  
David Gavin


Posts: 108
From: Winterthur, Switzerland
Registered: Aug 24, 2004
Re: Tip: Customising Web Galleries
Posted: Dec 16, 2005 6:16 AM   in response to: Ian Wood

Great tip, thanks!
If there are enough people interested perhaps we could make a website with Aperture web themes?
Even simple translations of the (for now) english-only themes could be useful. I could help with german translations.

PowerMac G5 2x2   Mac OS X (10.4.3)  
d2xshooter

Posts: 12
Registered: Dec 13, 2005
Re: Tip: Customising Web Galleries
Posted: Dec 16, 2005 6:57 AM   in response to: Ian Wood

Ian-

This is really fantastic information.

Thanks

G5 2x2.3ghz   Mac OS X (10.4.3)  
David Gavin


Posts: 108
From: Winterthur, Switzerland
Registered: Aug 24, 2004
Here is my stuff…
Posted: Dec 16, 2005 7:39 AM   in response to: David Gavin

Here you can find german translations of all Aperture web themes (and some Automator stuff).
Install into > Aperture/Contents/Resources/English.lproj/WebThemes

http://homepage.mac.com/dgavin/ApertureThemes/FileSharing36.html

   
Almechd

Posts: 2
Registered: Jan 11, 2006
Re: Tip: Customising Web Galleries
Posted: Jan 14, 2006 1:54 PM   in response to: Ian Wood

Thanks Ian for these instructions!!!

I'am used to customize web gallery templates from iView Multimedia
and now spent some time on the Aperture galleries. Although they are not
quite as flexible as iView, you can do a lot! But you have to do your HTML
and CSS homework.
A few things that I found annoying:
- If you edit the CSS file in the assets directory, the Aperture preview
is not always updating. Better edit and preview your style changes in
an already exported gallery and you webbrowser
- The Aperture preview does not support all styles. I used frames (padding/
border mix) in my templates, but they don't show up.
- The premade Apple templates use a few construct that don't really work
with (older?) versions of Internet Explorer. The missing previous/next
buttons are one example.

A few things I fixed in my template. Maybe you find that useful...

Here's one of the first examples:
http://magiclens.net/photos/southwest/slotcanyons/

If any Apple employees are reading this: Please let us use
individual metadata items, not just the whole set...
I'd like to see the whole set in the left column of the details page,
but only one caption underneath the image in addition.


PowerMac G5/Powerbook G4 12"   Mac OS X (10.4.4)  

   
Michael Alden

Posts: 6
Registered: Jul 23, 2004
Web Gallery Development
Posted: Jan 14, 2006 3:53 PM   in response to: Ian Wood

Hi all -

I think Aperture is great, but I have to admit I was very underwhelmed by the limited choice of web gallery templates.

I know Aperture is not a web authoring tool, but preparing nice looking web galleries for clients is extremely important for many professionals, particularly those (such as myself) who like to auto-generate nice pages from a template.

Although I do know a bit about editing CSS and HTML (not a lot, mind you....just the basics) I have to wonder how difficult it would be to develop web themes for Aperture in much the same way that other people are developing themes for Keynote, Pages, or RealMac Software's Rapidweaver.

Editing the themes using Ian's tip is a good start. I think it would be great if designers could take this one step further and develop some extra themes.
I know I'd pay for them.

In the meantime, I'll see if I can come up with anything.
Michael

G5 2.7 Dual   Mac OS X (10.4.4)  
Tom Rockwell


Posts: 33
Registered: Aug 16, 2005
Re: Tip: Customising Web Galleries
Posted: Jan 16, 2006 3:32 PM   in response to: Ian Wood

I'm trying to edit the Stock Black template and it only has a detail.html -- there doesn't seem to be a template for the thumbnail page. Does anyone know where Aperture gets the thumbnail layout for Stock Black?

I'd also like to say "thanks" to Ian for bringing this up and also point out that everyone better back up their changes somewhere outside the Aperture package just in case a program update removes the customized galleries.