Create a Complex HTML Email Signature For Mail on Mac OS X 10.9 Mavericks

mac-mail-mavricks

Apple’s new operating system, OS X Mavericks 10.9 is now available and best of all, upgrade is available for free! There are many small changes made to the new Mail.app but nothing significant. Follow this tutorial to install a complex HTML email signature for Mail 7.0.

To set up a HTML email signature on Mail 7.0, you need the following:

  • A Mac computer with Mail 7.0 running on Mac OS X Mavericks 10.9. (obviously)
  • A HTML file coded with your desired email signature design. For help creating the HTML email signature design, please click here.
  • A web server for hosting images.
  • Know how to upload images to your web server and get image links.

STEP 1: Create Placeholder Signature

  1. Open Mail
  2. Go to Preferences/Signatures
  3. Click on the + icon located on the bottom of the 2nd column
  4. Name the new placeholder signature

Mac Mail Preferences

Mac Mail Signatures settings

STEP 2: Assign Signature to Desired Email Account

  1. Drag the placeholder signature into the desired email account on the left
  2. Select/highlight desired email account on the 1st column
  3. Select your placeholder signature from the Choose Signature drop-down menu

Mac Mail assign signature

Mac Mail apply signature

STEP 3: Check Composing Settings

  1. Go to Composing tab
  2. Select Rich Text in the drop-down menu for “Message Format”

Mac Mail Composing Setting

STEP 4: Check Viewing Settings

  1. Go to Viewing tab
  2. Check Display remote images for HTML messages
  3. Close window and quit Mail

Mac Mail Viewing Setting

STEP 5: Set TextEdit to Display HTML Files as HTML Code

By default, TextEdit will display HTML files as formatted text. We need to display HTML files as HTML code so we can copy the code instead of the formatted design in STEP 7. HTML file will be emailed to you if you are using MYDESIGNPAD’s Email Signature Service.

  1. Open TextEdit.app
  2. Click “Open and Save” in TextEdit’s Preferences
  3. Check Display HTML files as HTML code instead of formatted text
  4. Quit TextEdit

TextEdit app

TextEdit setting

STEP 6: Locate Placeholder Signature

  1. Click on “Go” on your Finder menu; hold down the Option key to reveal Library on the drop-down menu
  2. Click on Library to open folder window
  3. If not using iCloud:
    Go to ~/Library/Mail/V2/MailData/Signatures/
    If you are using iCloud:
    Go to ~/Library/Mobile Documents/com~apple~mail/Data/MailData/Signatures/
  4. Turn on List view to see Date Modified
  5. Your placeholder signature is the file ending with .mailsignature with the most recent modified date

Open Library folder

Open Signature folder

STEP 7: Update Placeholder Signature

  1. Open placeholder signature file with TextEdit
  2. Delete everything under the Mime Version line
  3. Open the HTML file containing your email signature design with TextEdit
    (Your HTML file is emailed to you if you are using our Email Signature Service)
  4. Copy HTML code of your email signature design
  5. Paste HTML code into the placeholder signature file under the Mime Version line

Replace signature info

STEP 8: Lock File

Very important step to follow in order for signature to work.
Skip this step if you are using iCloud.

  1. Click on the downward triangle located on the top right of the opened file
  2. On the drop-down menu, check Locked
  3. Quit TextEdit

Lock signature file

STEP 9: Restart Mail

  1. Open Mail
  2. Click on the Compose new message button
  3. Your new HTML email signature should appear automatically
  4. If your HTML email signature doesn’t show up, make sure the correct email account is selected on the From drop-down menu below the Subject line
  5. Make sure your HTML email signature is selected in the Signature drop-down menu as well

Check email signature

Installation Completed

That Is It! Go on with Mail as usual. Happy email writing.

Follow responses through the RSS 2.0 feed | August 8th, 2013 | 202,022 views

72 comments »

  1. November 19th, 2014

    Tim Cai says:

    Sofia, make sure that the image linked and hosted remotely on a server. You cannot just drag the image into the signature area. It will become an attachment and appear as a blank box if you did that.

  2. November 19th, 2014

    Tim Cai says:

    Ingridi, yes this will work on Yosemite as well. There are some small changes but the instructions for Mavericks will work on Yosemite.

  3. December 8th, 2014

    […] Thanks Matt Coneybeare Timmy Cai […]

  4. February 9th, 2015

    LT says:

    Great tutorial – cannot get the jpg within the email signature to show. Have added a line in textedit underneath Mime – version and followed everything. The rest of the email signature is perfect but the logo doesn’t show. Any ideas? Thanks

  5. March 3rd, 2015

    paul says:

    Is there someone out there who would be willing and able to help me set this up. I have the signature in html ready but need some help to make it work in mac mail?

  6. March 20th, 2015

    Thomas says:

    Excellent tutorial! For those wanting the crispest possible graphic logo, link to a small PDF derived from a vector file such as Illustrator.

  7. March 22nd, 2015

    Tim Cai says:

    Thomas, have you tried it before with PDF files? And it works?

  8. March 25th, 2015

    Sam says:

    I don’t have a mail folder in the library… And no matter what I do and search for I cannot find .mailsignature file anywhere on my mac…!? I feel like I’m going crazy.. Should I be looking elsewhere?

  9. August 6th, 2015

    Shayne says:

    Hello Tim, I appreciate what you have done here. Really helpful stuff.
    I’m running a macbook(OS 10.9.5) and an iMac(10.9.5) with the same email.
    When I configure one auto signature on one machine, it blows away the one on the other machine. They are not shared through iCloud as far as I can tell. Is there a way to keep the signatures on both machines so I can travel?
    Thank you, Shayne

  10. August 6th, 2015

    Lisa says:

    I have been trying for days now to get this to work.

    I am truly unsure what I am doing wrong, can some assist pls.

    I am on version 10.9.5

    Lisa

  11. August 13th, 2015

    Lea says:

    Thanks for this, it works great except when I send an email to a Gmail account as Gmail obviously blocks it as a spam :-( any idea how to avoid this? (my signature is very simple, a small image logo, a link to my site and my phone number, so nothing special here).
    Thank you,
    Lea

  12. October 21st, 2015

    Pam Kahl says:

    Hi – Great tutorial. Although when I launch a new message, the signature stays static. It won’t move down the page as I type. Additionally, there is no white space above the signature for me to start an email message. Can you please offer guidance?

    Thank you.
    Pam

  13. November 2nd, 2015

    Lynn says:

    Hi Tim,
    Thanks I have always found your guides easy to follow and work. However right now I can’t get the first part to work.
    I’m using 10.9.5.
    Every time I create a new signature–step one– (the placeholder) and close Mail, it disappears. Seems unable to save the signature that is being used as the ‘placeholder’. So when I go into the Library>Mail>Mail data> signatures I find no new .mailsignature file.
    Any help would be much appreciated. Thanks.

  14. December 13th, 2015

    Catherine says:

    HI this is great until I hit Placeholder signature. I only see7D932BCF-5082-44E3-B025-F7E864DCC789.webarchive

    Webarchive. I dont’ know if this is code or not. Mac 10.7.5 AND the option to ‘Display html files as Html code…” doesn’t exist but only as ‘Ignore rich text commands in html files’ which I have not checked off.
    Suggestions?

    Thanks you

  15. January 5th, 2016

    Tim Cai says:

    Hi Lynn, sorry for the late reply, did you resolve your problem yet? If not, email me for help instead.

  16. January 5th, 2016

    Tim Cai says:

    Dear Pam, you can add extra line spacing by adding on a br tag. But I am not sure why the signature doesn’t shift downward as you compose your message. It should automatically shift down if the signature is installed correctly.

  17. April 6th, 2016

    Hi
    I’m using OSX 10.11.4,
    Do you have a solution for that OSX?
    I’m stopped at step 6 , it is complete different.
    Many thanks in advance!

  18. May 29th, 2016

    Tim Cai says:

    Here you go: http://mydesignpad.com/how-to-create-an-attractive-html-email-signature-for-mail-on-mac-os-x-el-capitan-10-11/

  19. July 26th, 2016

    Hi Tim, I found the workaround using Terminal and Text Edit…Thanks anyway-and thanks for posting

  20. July 30th, 2016

    Tim Cai says:

    John, Thanks for sharing.

  21. September 18th, 2016

    Min says:

    Like Shayne (Aug 6 2015) I am also running a number of work email accounts on 2 separate machines – I can set up each machine to work nicely, but again like Shayne, as soon as I set up one machine it knocks the other out – pls tell me how I can fix this … TIA!

  22. October 13th, 2016

    Tim Cai says:

    Min and Shayne, try installing your signature on each machine and give your signature a totally different name.

Leave a comment * Required fields.


About

  • "Sure someone else could have created a greater logo redesign for EME Lighting but I was sold on Tim’s diligence & reliability plus I love our new logo! It is fresh, symbolic of who we are while staying in line with our brand intention."

    - Bill Lee
    CEO of EME Lighting
  • "Tim is a trustworthy and effective designer. He redesigned the entire visual identity system for my company & I am extremely pleased with it. As the CEO of a company with over 3000 employees, I would recommend Timmy to anyone looking to have some serious design work done."

    - Tony Ou
    CEO of Senqiu Lighting
  • "Tim effectively designed my website and newsletter. What impressed me the most was his ability to create the images, style and design I was looking for. I highly recommend him if you are looking for someone reliable, flexible and talented."

    - Christine M.
    Owner of Acupuncturebody
  • "Tim has a great personality that makes him a pleasure to work with. He is focused, hard working & always has an attention to details. He has great curiosity and constantly strives to learn & develop himself taking his work to the next level"

    - Slava S.
    Director of Creative Services at STV
  • "Tim conceptualized original ideas & executed the design brilliantly. He always made sure the highest technical & design standards were met. I could always count on him to translate the client vision into reality."

    - Linda G.
    VP Biz Dev. at Real Estate Arts
  • "Tim is a highly talented designer. He has excellent technology skills, amazing dedication & terrific interpersonal abilities."

    - Michael S.
    AD at Real Estate Arts
  • "Timmy is a very talented designer, he is passionate and reliable, his work is always creative & on time. He’s a good person with lots of energy, which makes him a pleasure to work with."

    - Jess L.
    AD at Sudler & Hennessey
  • "Timmy got a great system for helping you figure out what you want, need & putting those ideas down into a tangible product. He has done 3 sites for me already & anyone I have recommended him to has called me back to thank me."

    - Vahram S.
    Owner of Brooklyn Body