Easily Create Custom Stationary in Apple’s Mail.App

by Mark on February 13, 2010

I write a monthly internal newsletter to our company My first edition was a little lackluster and the images I so carefully crafted resided on my hard drive were none of my colleagues could read them. So I decided to figure out how to create custom stationary that I could update and send on a monthly basis. A lot of the solutions I saw were surprisingly complex. The Save as Stationary feature works fine once you have the template created but editing and creating a template in the message email environment isn’t easy. So here’s my solution.

Step 1 – Create Your Email Template

Create your email template outside of your email editor, most likely in a HTML editor. Here are some tips:

Create your email template in your editor in a table, I made my 600 pixels wide and formatted it in a table. You can go as wide as 650 pixels but I wouldn’t suggest any wider.
MailChimp has some nice free email templates if you need a starter template.
Add your CSS styles inside your <body> tags rather than in the header as you might normally do.

Step 2 – Add the Markup for Apple Mail.App

Now encapsulate your HTML body inside the following span text (I got this part from David Todd Watson’s Blog) :

<span contenteditable=”true” apple-content-name=”body” style=”display: block; “>

<div>

<div style=”word-wrap: break-word; -webkit-nbsp-mode: space; -webkit-line-break: after-white-space; “>

Followed by this code which will make the email editable in Mail.app:

Once you add your text close your tags by adding the following right before your </body> tag.

</div>
</span><br>
</div>
</span>

<!– END CONTENT SECTION –>

Then save your file.

Step 3 – Open Your Template in mail.app

Now open your HTML file in Safari. Then press Command-I to open the file in Mail.app. This should give you an email that looks the way you would like.

Step 4 – Update Images

Now for the image files. Go into your message editor and delete the image files that are linked to your hard drive. Then use the Attach function to attach the images and drag them were they need to go.

Step 4a – Optional Quick and Dirty Solution

If you want a quick and dirty solution you can go to File and Save and save the email in your Drafts folder. Then drag it into a folder you created. I originally called mine “aTemplates” so it would show up at the top of my folder list in mail.app. When you need to use the stationary then copy the email to your drafts folder and edit away. I only mention this method is occasionally when you use the method described in Step 4b it doesn’t save properly, still working on the cause.

Step 4b – Save as Stationary

If you don’t opt for the quick and dirty method you can now go to File and Save as Stationary this should create the stationary. To use this method you can use the Show Stationary button in the Mail.app editor. Then navigate to Custom and your template should show up as an image in the custom stationary list.

This method worked for me but would love feedback in case I am missing something.

	FOLLOW ME ON TWITTER
	GET LINKEDIN
	CONNECT ON FACEBOOK
	PHOTOS ON FLICKR
	STUMBLE IT
	DO YOU DIGG IT?
	TRAVEL WITH TRIPIT
	CONNECT ON IDENT.CA
	CLAIMID
	MY TUMBLEBLOG
	FOURSQUARE

Easily Create Custom Stationary in Apple’s Mail.App

Step 1 – Create Your Email Template

Step 2 – Add the Markup for Apple Mail.App

Step 3 – Open Your Template in mail.app

Step 4 – Update Images

Step 4a – Optional Quick and Dirty Solution

Step 4b – Save as Stationary

Related Articles

Search SocializedSoftware

Categories

Recent Twitter Posts

Tag Cloud

Recent Twitter Visitors

About

Connect

Upcoming Speaking Gigs

Search

Flickr photostream