I host all my images on SmugMug but it’s kind of cumbersome to store the images there and use them on a blog … at least if you want to have a lightbox effect. But thanks to SmuginPro for Aperture it’s now quite simple to do this.
Note: it should actually use with images hosted at Flickr if they have been exported with FlickrExport but I haven’t really tried that part.
Before going into details I would like to point out that I’m using a non-standard way of linking my images, instead of the standard HTML img links I use my own custom links that looks like this:
[ smug src='859041109_2mRyF-M.jpg' width='600' height='450' psize='XL' group='uu']Not happy[/ smug]
This makes it possible for me to build the HTML code for the image/popup on the fly, making changes to my setup very easy to change.
So let’s start. The first thing I do is to export my images from Aperture using SmuginPro for Aperture, I’ve configured the plugin to save meta data about the exported pictures – so after export I can see this in Aperture.
Then I run the following Applescript (note that this version of the Applescript outputs standard HTML and not the custom links I normally use)
-- SmugMug sizes
-- Tiny - 100*100
-- Thumbnail - 150*150
-- Small - 400*300
-- Medium - 600*400
-- Large - 800*600
-- XLarge - 1024*768
-- XXLarge - 1280*960
--set photosize to button returned of (display dialog "What size?" buttons {"Small", "Medium", "Large"})
property sizes : {"Tiny 100*100", "Thumbnail 150*150", "Small 400*300", "Medium 600*400", "Large 800*600", "XLarge 1024*768", "XXLarge 1280*960"}
property sizeIndexName : "TinyThumSmalMediLargXLarXXLa"
property sizeWidths : {100, 150, 400, 600, 800, 1024, 1280}
property sizeHeights : {100, 150, 300, 400, 600, 768, 960}
property sizeSmug : {"Ti", "Th", "S", "M", "L", "XL", "X2"}
----------------------------------------------------------------------
-- This is the link formatting I use. I use a custom wordpress
-- plugin to build the actual HTML tags when the pages
-- are requested. That way I can change the layout of all
-- my photos my modifying the plugin
--
--on makeLink(sizeIndex, photo)
-- set imgSize to calcSize(phwidth of photo, phheight of photo, item sizeIndex of sizeWidths, item sizeIndex of sizeHeights)
-- return "[smug src='" & smugmugID of photo & "_" & smugmugImageKey of photo & "-" & item sizeIndex of sizeSmug & ".jpg' width='" & item 1 of imgSize & "' height='" & item 2 of imgSize & "' psize='XL' group='uu']" & headline of photo & "[/smug]" & return & return & caption of photo & return
--end makeLink
--
----------------------------------------------------------------------
----------------------------------------------------------------------
-- This version of makeLink outputs static HTML and use
-- my own CSS snippet to do the formatting on screen
-- Set smugmugdomain to your smugmug domain, don't forget "/photos"
-- at the end.
----------------------------------------------------------------------
property smugmugdomain : "http://album.mostrom.pp.se/photos/"
property smugmugpopupsize : "-XL.jpg"
on makeLink(sizeIndex, photo)
set imgSize to calcSize(phwidth of photo, phheight of photo, item sizeIndex of sizeWidths, item sizeIndex of sizeHeights)
--return "[smug src='" & smugmugID of photo & "_" & smugmugImageKey of photo & smugmugpopupsize & "\" width='" & item 1 of imgSize & "' height='" & item 2 of imgSize & "' psize='XL' group='uu']" & headline of photo & "[/smug]" & return & return & caption of photo & return
return "<div class="photoblock"><div class="photocenter" style="width:"><a href="" rel="lightbox[uu]"><img src="" width="" height="" alt="" /></a></div>"
end makeLink
on sendToMarsEdit(links, meta)
set nrOfItems to the number of items of links
repeat with ll from 1 to nrOfItems
set x to item ll of meta
my createBlogEntry("svenska", phdate of x, headline of x, item ll of links, "", phkeywords of x)
end repeat
end sendToMarsEdit
on getInfo(curItem)
-- Read the meta info from Aperture
set metaInfo to {headline:"", caption:"", phkeywords:"", phdate:"", phwidth:"", phheight:"", flickrID:"", flickrURL:"", smugmugGallery:"", smugmugGalleryID:"", smugmugGalleryKey:"", smugmugID:"", smugmugImageKey:""}
tell application "Aperture"
tell curItem
set phwidth of metaInfo to width
set phheight of metaInfo to height
try
set phdate of metaInfo to value of EXIF tag "ImageDate"
set headline of metaInfo to value of IPTC tag "Headline"
set caption of metaInfo to value of IPTC tag "Caption/Abstract"
set phkeywords of metaInfo to value of IPTC tag "Keywords"
end try
try
set flickrID of metaInfo to value of custom tag "Flickr ID"
set flickrURL of metaInfo to value of custom tag "Flickr URL"
end try
try
set smugmugGalleryID of metaInfo to value of custom tag "SmugMug Gallery ID"
set smugmugGallery of metaInfo to value of custom tag "SmugMug Gallery"
set smugmugGalleryKey of metaInfo to value of custom tag "SmugMug Gallery Key"
set smugmugID of metaInfo to value of custom tag "SmugMug ID"
set smugmugImageKey of metaInfo to value of custom tag "SmugMug Image Key"
end try
end tell
end tell
return metaInfo
end getInfo
on calcSize(orgWidth, orgHeight, maxWidth, maxHeight)
if maxWidth = 100 then
return {100, 100}
else if maxWidth = 150 then
return {150, 150}
else
set widthRatio to orgWidth / maxWidth
set heightRatio to orgHeight / maxHeight
if widthRatio < heightRatio then
set ratio to widthRatio
else
set ratio to heightRatio
end if
return {round (orgWidth / ratio), round (orgHeight / ratio)}
end if
end calcSize
on sendToBBEdit(theLinks)
set AppleScript's text item delimiters to {return}
tell application "BBEdit"
make new text document with properties {contents:theLinks as text}
end tell
end sendToBBEdit
-- Create a blog entry using MarsEdit
-- p_blog : Which blog to use
-- p_date : The posting date of the entry
-- p_title : The title of the entry
-- p_body : The actual content of the entry
-- p_category : The category in which the post should be filed
-- p_taglist : A string with comma separated tags
on createBlogEntry(p_blog, p_date, p_title, p_body, p_category, p_taglist)
set c_title to normalize unicode p_title without decomposition
set c_body to normalize unicode p_body without decomposition
set c_taglist to normalize unicode p_taglist without decomposition
tell application "MarsEdit"
set newPost to make new document
set current blog of newPost to blog p_blog
tell newPost
set body to c_body
if p_category ≠ "" then
set category names to {p_category}
end if
set published date to p_date
set tags to c_taglist
set title to c_title
end tell
end tell
end createBlogEntry
on run
set res to item 1 of (choose from list sizes default items {"Medium 600*400"})
-- I hate doing things like this in Applescript ... there has to be a better way!!
set sizeSelected to (characters 1 thru 4 of (word 1 of res)) as text
set sizeIndex to 1 + (offset of sizeSelected in sizeIndexName) div 4
-- Get the selected images
tell application "Aperture"
set selectedImages to selection
end tell
-- Loop over the selected images and generate links for them
set links to {}
set meta to {}
repeat with aphoto in selectedImages
set metaInfo to getInfo(aphoto)
set end of links to makeLink(sizeIndex, metaInfo)
set end of meta to metaInfo
end repeat
-- Where to put the result
set dest to button returned of (display dialog "Sent the links where?" buttons {"BBEdit", "MarsEdit"} default button 2)
if dest = "MarsEdit" then
sendToMarsEdit(links, meta)
else if dest = "BBEdit" then
sendToBBEdit(links)
end if
end run
-- Tiny - 100*100
-- Thumbnail - 150*150
-- Small - 400*300
-- Medium - 600*400
-- Large - 800*600
-- XLarge - 1024*768
-- XXLarge - 1280*960
--set photosize to button returned of (display dialog "What size?" buttons {"Small", "Medium", "Large"})
property sizes : {"Tiny 100*100", "Thumbnail 150*150", "Small 400*300", "Medium 600*400", "Large 800*600", "XLarge 1024*768", "XXLarge 1280*960"}
property sizeIndexName : "TinyThumSmalMediLargXLarXXLa"
property sizeWidths : {100, 150, 400, 600, 800, 1024, 1280}
property sizeHeights : {100, 150, 300, 400, 600, 768, 960}
property sizeSmug : {"Ti", "Th", "S", "M", "L", "XL", "X2"}
----------------------------------------------------------------------
-- This is the link formatting I use. I use a custom wordpress
-- plugin to build the actual HTML tags when the pages
-- are requested. That way I can change the layout of all
-- my photos my modifying the plugin
--
--on makeLink(sizeIndex, photo)
-- set imgSize to calcSize(phwidth of photo, phheight of photo, item sizeIndex of sizeWidths, item sizeIndex of sizeHeights)
-- return "[smug src='" & smugmugID of photo & "_" & smugmugImageKey of photo & "-" & item sizeIndex of sizeSmug & ".jpg' width='" & item 1 of imgSize & "' height='" & item 2 of imgSize & "' psize='XL' group='uu']" & headline of photo & "[/smug]" & return & return & caption of photo & return
--end makeLink
--
----------------------------------------------------------------------
----------------------------------------------------------------------
-- This version of makeLink outputs static HTML and use
-- my own CSS snippet to do the formatting on screen
-- Set smugmugdomain to your smugmug domain, don't forget "/photos"
-- at the end.
----------------------------------------------------------------------
property smugmugdomain : "http://album.mostrom.pp.se/photos/"
property smugmugpopupsize : "-XL.jpg"
on makeLink(sizeIndex, photo)
set imgSize to calcSize(phwidth of photo, phheight of photo, item sizeIndex of sizeWidths, item sizeIndex of sizeHeights)
--return "[smug src='" & smugmugID of photo & "_" & smugmugImageKey of photo & smugmugpopupsize & "\" width='" & item 1 of imgSize & "' height='" & item 2 of imgSize & "' psize='XL' group='uu']" & headline of photo & "[/smug]" & return & return & caption of photo & return
return "<div class="photoblock"><div class="photocenter" style="width:"><a href="" rel="lightbox[uu]"><img src="" width="" height="" alt="" /></a></div>"
end makeLink
on sendToMarsEdit(links, meta)
set nrOfItems to the number of items of links
repeat with ll from 1 to nrOfItems
set x to item ll of meta
my createBlogEntry("svenska", phdate of x, headline of x, item ll of links, "", phkeywords of x)
end repeat
end sendToMarsEdit
on getInfo(curItem)
-- Read the meta info from Aperture
set metaInfo to {headline:"", caption:"", phkeywords:"", phdate:"", phwidth:"", phheight:"", flickrID:"", flickrURL:"", smugmugGallery:"", smugmugGalleryID:"", smugmugGalleryKey:"", smugmugID:"", smugmugImageKey:""}
tell application "Aperture"
tell curItem
set phwidth of metaInfo to width
set phheight of metaInfo to height
try
set phdate of metaInfo to value of EXIF tag "ImageDate"
set headline of metaInfo to value of IPTC tag "Headline"
set caption of metaInfo to value of IPTC tag "Caption/Abstract"
set phkeywords of metaInfo to value of IPTC tag "Keywords"
end try
try
set flickrID of metaInfo to value of custom tag "Flickr ID"
set flickrURL of metaInfo to value of custom tag "Flickr URL"
end try
try
set smugmugGalleryID of metaInfo to value of custom tag "SmugMug Gallery ID"
set smugmugGallery of metaInfo to value of custom tag "SmugMug Gallery"
set smugmugGalleryKey of metaInfo to value of custom tag "SmugMug Gallery Key"
set smugmugID of metaInfo to value of custom tag "SmugMug ID"
set smugmugImageKey of metaInfo to value of custom tag "SmugMug Image Key"
end try
end tell
end tell
return metaInfo
end getInfo
on calcSize(orgWidth, orgHeight, maxWidth, maxHeight)
if maxWidth = 100 then
return {100, 100}
else if maxWidth = 150 then
return {150, 150}
else
set widthRatio to orgWidth / maxWidth
set heightRatio to orgHeight / maxHeight
if widthRatio < heightRatio then
set ratio to widthRatio
else
set ratio to heightRatio
end if
return {round (orgWidth / ratio), round (orgHeight / ratio)}
end if
end calcSize
on sendToBBEdit(theLinks)
set AppleScript's text item delimiters to {return}
tell application "BBEdit"
make new text document with properties {contents:theLinks as text}
end tell
end sendToBBEdit
-- Create a blog entry using MarsEdit
-- p_blog : Which blog to use
-- p_date : The posting date of the entry
-- p_title : The title of the entry
-- p_body : The actual content of the entry
-- p_category : The category in which the post should be filed
-- p_taglist : A string with comma separated tags
on createBlogEntry(p_blog, p_date, p_title, p_body, p_category, p_taglist)
set c_title to normalize unicode p_title without decomposition
set c_body to normalize unicode p_body without decomposition
set c_taglist to normalize unicode p_taglist without decomposition
tell application "MarsEdit"
set newPost to make new document
set current blog of newPost to blog p_blog
tell newPost
set body to c_body
if p_category ≠ "" then
set category names to {p_category}
end if
set published date to p_date
set tags to c_taglist
set title to c_title
end tell
end tell
end createBlogEntry
on run
set res to item 1 of (choose from list sizes default items {"Medium 600*400"})
-- I hate doing things like this in Applescript ... there has to be a better way!!
set sizeSelected to (characters 1 thru 4 of (word 1 of res)) as text
set sizeIndex to 1 + (offset of sizeSelected in sizeIndexName) div 4
-- Get the selected images
tell application "Aperture"
set selectedImages to selection
end tell
-- Loop over the selected images and generate links for them
set links to {}
set meta to {}
repeat with aphoto in selectedImages
set metaInfo to getInfo(aphoto)
set end of links to makeLink(sizeIndex, metaInfo)
set end of meta to metaInfo
end repeat
-- Where to put the result
set dest to button returned of (display dialog "Sent the links where?" buttons {"BBEdit", "MarsEdit"} default button 2)
if dest = "MarsEdit" then
sendToMarsEdit(links, meta)
else if dest = "BBEdit" then
sendToBBEdit(links)
end if
end run
The script asks me what size I want the pictures and then where it should send the links. If you select BBEdit you will get the links as is in a new text window. If you select MarsEdit you will get one blog entry for each photo with the title and keywords filled in (this info is read from the meta data of the info), the body will consist of the image link plus whatever you have entered as a caption in Aperture.
Note that you need to change "svenska" in this line
my createBlogEntry("svenska", phdate of x, headline of x, item ll of links, "", phkeywords of x)
to the blog name you use in MarsEdit
The CSS styling I use is:
.photoblock
{
text-align:center;
}
.photocenter
{
margin:auto;
margin-bottom: 10px;
}
.photocenter img
{
padding: 3px;
border: 1px solid #888;
}
.photocenter p
{
text-align:center;
}
{
text-align:center;
}
.photocenter
{
margin:auto;
margin-bottom: 10px;
}
.photocenter img
{
padding: 3px;
border: 1px solid #888;
}
.photocenter p
{
text-align:center;
}
To get the lightbox effect you also need to install one of the lighbox plugins on your blog. I have my doubts that anyone but my will find this useful 
Love the use of AppleScript, it is easy to forget how much can be achieved using it and nowadays with the scripting bridge you should be able to use ruby or python etc. to do it too.
Love the use of AppleScript, it is easy to forget how much can be achieved using it and nowadays with the scripting bridge you should be able to use ruby or python etc. to do it too.