21 februari 2010

Een HTML/CSS handtekening toevoegen aan OS X Mail (archief)

2 min leestijd

Wanneer je in OS X Mail gebruik maakt van een handtekening (signature) onderaan je emails dan heb je alleen de beschikking over de 'rich text format (rtf)' editor. Dit is voldoende als je een simpele handtekening wilt maken. Het toevoegen van elementen zoals plaatjes, logo's, HTML of CSS is standaard niet mogelijk.

Update: Onderstaand artikel is verouderd en ingewikkeld, maar werkt nog steeds. Ondertussen hebben we een vereenvoudigde versie online geplaatst met een gratis E-mail HTML-handtekening tool. Klik hier om deze tip te openen.

Hieronder vind je een stappenplan waar mee het toch mogelijk is om HTML en CSS toe te voegen aan een handtekening.

1. Open de OS X Mail-applicatie en ga naar Mail ▸ Voorkeuren. Selecteer de sectie 'Handtekeningen' en voeg een nieuwe handtekening toe door middel van de '+'-knop.

Je hoeft hier verder niets aan te passen, sluit OS X Mail af (belangrijk!) en maak met behulp van een editor een html signature.

De door mij gebruikte html/css voorbeeld handtekening kan je hier dowloaden:

[download is niet meer beschikbaar]

2. Nadat je klaar bent met het ontwerpen van je handtekening open je deze in Safari. Ga in Safari naar Bestand ▸ Opslaan als... en bewaar de pagina in de Web Archive structuur.

3. Ga nu in Finder naar je home folder en open de map: Bibliotheek ▸ Mail ▸ Signatures.

In deze map tref een bestand aan met een identificatie-code en deze eindigend op .webarchive. Kopieer deze naam door het bestand te selecteren ▸ enter toets ▸ crtl-c.

Geef je zelf gemaakte handtekening uit stap 2 dezelfde bestandsnaam en plaats deze hierna in de map Bibliotheek ▸ Mail ▸ Signatures. Op de vraag of het bestand vervangen dient te worden selecteer je 'Vervang'.

Je vervangt dus de door OS X Mail genereerde handtekening uit stap 1 door je eigen ontwerp uit stap 2.

4. Open opnieuw OS X Mail en ga naar Mail ▸ Voorkeuren ▸ Handtekeningen. In het venster zie je de aangemaakte verschijnen. Sleep de handtekening naar het email account waarmee je deze wilt gebruiken en je bent klaar.

Eventueel kan je onderin het venster nog je standaard handtekening selecteren, deze wordt dan automatisch toegevoegd aan een nieuwe email. Als je dit niet doet dan kan je de handtekening handmatig selecteren.

Het resultaat:

info
Auteur Richard IJzermans
Bijgewerkt03/02/2017 16:06
Categorie macOS
Feedback Probleem melden
Delen 𝕏
  37 reacties


Reacties

  • wivku
    21 februari 2010 om 13:46

    Hou er rekening mee dat niet elke client op dezelfde manier de signature toont bv. background images, gegroepeerde CSS. Vaak laat Outlook het heel anders zien. CSS is in orde, maar dan beter inline, dus niet als aparte groep.

    Wat handige tips:

    http://www.emailsignature.eu/phpBB2/4-tips-that-will-make-your-email-signature-design-work-great-t1199.html

    Op die site ook een tool om te testen hoe het er uit gaat zien op andere systemen.

  • Richard
    21 februari 2010 om 15:51

    Ik heb het voorbeeld aangepast, zodat deze ook goed in Gmail verschijnt.

    http://www.appletips.nl/wp-content/plugins/download-monitor/download.php?id=21

  • Max
    21 februari 2010 om 19:52

    Bovenstaande tip heb ik uitgevoerd maar bij collega’s worden in Outlook mijn logo’s niet weergegeven.

    Tevens krijgen outlook gebruikers mijn e-mails in times new roman. Ook als ik verdana of Arial als lettertype gebruik. Hoe kan je dit nu voorkomen??

  • wivku
    21 februari 2010 om 22:21

    Logo’s in Outlook: als je het als CSS background gebruikt -zoals in het voorbeeld- dan wordt het in Outlook volgens mij (of eigenlijk: volgens tip #2 uit de emailsignature link) inderdaad niet getoond.
    Voor font: het font dat hierboven genoemd wordt, heeft alleen effect op de signature. Het is (vreemd!) niet mogelijk om het algemene font in te stellen.
    Wel met een truukje, vergelijkbaar met bovenstaande tip.
    Maak een signature als volgt:

    [plaats hier de mail]

  • wivku
    21 februari 2010 om 22:22

    Ah, het lukt niet om HTML codes in een comment te stoppen, zie hier -stap 3- voor de details:
    http://www.sriramkrishnan.com/blog/2009/08/setting-outgoing-font-in-apple-mail.html

  • Biker
    21 februari 2010 om 22:39

    Wat een geweldige tips hier, net nu ik bezig ben om voor het bedrijf een goede universele handtekening te maken voor drie soorten clients; Lotus Notes 7, Outlook 2007 en Apple Mail 4.

  • wivku
    22 februari 2010 om 14:07

    Vanmorgen tegen nog een probleem aangelopen: als je bv. een PDF in de mail meestuurt, dan wordt de HTML signature opeens een attachment in Outlook.

    Nog een handige link, Outlook komt er niet zo goed van af als het om standaarden gaat: http://www.email-standards.org/clients/microsoft-outlook-2007/
    Daarom het initiatief: http://fixoutlook.org/

  • Vincent
    27 februari 2010 om 7:13

    ”Kopieer deze naam door het bestand te selecteren ▸ enter toets ▸ crtl-c.”

    Moet dit niet Command + C zijn? Volgens mij wel, maar kan zijn dat ik mij vergis.

  • Jill
    18 mei 2010 om 11:21

    Dank jullie wel voor de tutorial over html handtekening toevoegen aan OS X mail.
    Het gaat bij mij bijna goed… De tekst wordt weergegeven in mijn handtekening alleen bij het plaatje staat een vraagteken en wordt dus niet getoond.
    Kunnen jullie me helpen?
    Thanx

  • Greenflash
    11 juni 2010 om 11:42

    Na de update van Safari 5 werkt mijn HTML handtekening niet meer? Ik heb het net getest op een machine die nog niet geupdate was en daar alles nog perfect. Lijkt erop dat Safari 5 ook zaken in Apple Mail veranderd. Iemand een oplossing?

  • Theo
    13 augustus 2010 om 18:09

    Net Als Jill (nummer 9 ) krijg ik bij mijn mail geen afbeeldingen te zien , alleen een blauw blokje met vraagteken. Bij mail voorkeuren : handtekeningen krijg wel de volledige preview te zien van de handtekening. Iemand een idee ? ik heb al geprobeerd om de images map te kopieeren naar de map waar de handtekening staat : maar dit bied geen oplossing.

  • Van Belle Servaas
    9 oktober 2010 om 13:25

    Ik gebruik deze techniek al een poos op mijn Mac Book en iMac.. maar plots werkt dit niet meer op de iMac…
    Dit nochtans met hetzelfde webarchief-bestand…
    Bij een test op een andere Mac Book lukt dit ook niet…

    Samenvatting.. op mijn computer kan ik deze techniek gebruiken maar op twee andere niet..

    Hoe kan dat ?

  • Frank
    5 november 2010 om 11:58

    Hallo,

    Ik krijg net als Jill en Theo ene blok met een vraagteken, terwijl bij Voorkeuren het wel goed getoond wordt.

    Heeft iemand een tip om dit op te lossen?

    Alvast bedankt!
    Mvg

  • ginny
    20 december 2010 om 22:30

    net als jill en theo… ik ook! is er niemand die kan helpen? ik zoek me een ongeluk… come on apple freaks, this shouldn’t be that hard, or is it?

    groetjes,
    ginny

  • Richard IJzermans
    20 december 2010 om 22:35

    Ik zal van de week het artikel updaten, Apple heeft in de Mail app namelijk iets aangepast waardoor het niet meer werkt.

    –R

  • max
    21 december 2010 om 10:52

    Ik gebruik deze optie al heel lang, maar al die tijd is het op Windows computers niet leesbaar. Als ik een mail naar een windows gebruiker stuur dan komen er altijd kruisjes ipv de afbeeldingen. Outlook vraagt dan of de afbeeldingen geladen mogen worden. Tevens komen al mijn mails bij windows gebruikers aan met courier lettertype terwijl ik typ in verdana.

  • Peppijn
    12 maart 2011 om 15:49

    Ik heb ook het probleem met het vraagteken de ene keer wordt het plaatje wel weergegeven en de andere keer niet????
    Wie zou hier mee kunnen helpen, heb inmiddels de toppen van mijn vingers gesurft echter tot nu toe geen blijven werkende oplossing

  • Menno
    11 juni 2011 om 23:57

    @Richard : is het artikel al aangepast ? in Outlook komt mijn handtekening wel goed aan maar vreemd genoeg zie ik geen logo in Mail.

  • Menno
    12 juni 2011 om 3:18

    Misschien dat ik het allemaal niet goed begreep maar volgens mij is het makkelijker om een handtekening te creëren in een nieuwe email.

    Deze dan via Cmd C kopiëren en Cmd V plakken in de handtekening via Voorkeuren.

    Het ziet er goed uit voor alle ontvangers… Outlook, Gmail etc

  • Menno
    12 juni 2011 om 3:19

    oh en dit werkt gewoon wel met plaatjes… :-)

  • Francisca Zonjee
    9 augustus 2011 om 19:40

    Weet iemand hoe je een facebook button plaatst in je handtekening, zodat de ontvanger kan linken naar je facebook fanpage? Hetzelfde geldt ook voor een linkedIn button?
    Ik heb een mac en gewoon mac mail.

  • Joep
    24 augustus 2011 om 21:55

    Hallo,

    zelfde probleem: alle stappen uitgevoerd, maar geen plaatje, alleen een vraagtekentje.

    Wat ik wil is het volgende:
    mijn bedrijfslogo (afbeelding) inclusief n.a.w. gegevens (als opgemaakte tekst) in een handtekening.

    Wat voor mij superhandig zou zijn is een Mac programma waarbij ik mijn handtekening zelf kan ontwerpen en waarbij de achterkant automatisch van html wordt voorzien. Ik kan namelijk geen html lezen. Deze html wil ik dan in mijn websitefolder plaatsen en deze linken naar de handtekeninginstellingen in mail. Als dit tenminste mogelijk is…

    Ik hoor graag van je/jullie!

    Gr. Joep

  • Jor
    11 oktober 2011 om 22:03

    Helaas krijg ook ik een vraagteken te zien. Is er inmiddels een oplossing voor?

    preview bij voorkeuren is wel zichtbaar.

  • Jolanda
    17 januari 2012 om 10:06

    De hele stap met webarchive en kopieren hoeft niet!
    als je je handtekening in html opent in safari, gewoon cmnd a, cmnd c en weer plakken met cmnd v in je handtekening bij mail > voorkeuren

  • Angelo
    27 januari 2012 om 14:06

    heb een probleem met stap 3: vind geen map: Bibliotheek ▸ Mail ▸ Signatures.
    Met zoekfunctie vindt ik ook bijv. de map Bibliotheek of Library niet. Ik dacht dat iedere user wel een Library had, maar waarom die bij mij niet meer zichtbaar is? Joost mag het weten.

  • Mark
    18 september 2013 om 16:41

    Dit artikel heeft een update nodig, want de hier beschreven methode werkt voor de laatste versie(s) van Apple Mail niet meer.

    Hoe het wel kan vind je hier:
    http://www.xenon-webdesign.co.uk/dev/create-graphical-html-signature-mac-mail-os-mountain-lion/

  • Jonathan
    3 januari 2014 om 0:44

    Ivm de foto’s. Ik denk dat jullie de foto van jullie locale schijf laten draaien. Hier wringt echter het schoentje. Je moet de url ingeven waar de foto op geplaatst staat. Bv. eerste foto van deze site:

  • Jonathan
    3 januari 2014 om 0:46

    html code kwam er niet door dus hier een voorbeeld van de url: http://cdn.appletips.nl/wp-content/uploads/2010/02/appletips.html.png

  • Wiesje
    12 februari 2014 om 19:36

    Hallo,
    Dank voor de uitleg! Ik ben al een heel eind, maar ergens doe ik toch iets niet goed. Ik volg alle stappen, heb een signature aangemaakt met mijn bedrijfslogo erin. Alles lukte. Deze verschijnt nu in een draft of als ik een mail naar mezelf stuur (via apple mail). (Ik heb via een onlineconvertor mijn logo (jpg) in html codering overgezet en daar vervolgens via textwrangler een html van gemaakt en de verdere stappen gevolgd). Echter, als ik nu een mail verstuur naar een ander mailadres, dan verdwijnt het logo. Ook als ik de naar mijzelf gestuurde mail (met logo) forward, dan verdwijnt dat logo ook. Help? Dank!!

  • Pim
    26 maart 2014 om 11:11

    Hallo, ik heb een mail signature in OSX 10.7 gemaakt met in de style/css @media query voor een responsive signature. Dit werkt op alle devices prima! Mijn signature zit in een .webarchive file. Nu zijn er sommige collega’s die hun mac wel hebben geupdate naar 10.8 of hoger en daar zit de signature in een .mailsignature file. Ik krijg de @media query hier niet werkend!! Iemand een oplossing hiervoor?? Alvast bedankt.

  • Jorgen
    8 juli 2014 om 7:13

    ik krijg het niet goed voor elkaar, als ik die gegevens zie in die teksteditor dan word ik echt duizelig. Ik snap niet dat dit zo ingewikkeld gemaakt word door apple. Kan iemand me niet even helpen voor het maken van mijn handtekening. Het hoeft niet gratis.

  • Rick
    21 augustus 2014 om 16:44

    Ik ben zover dat ik mijn html bestand heb opgemaakt. Echter in de map “signatures” staan alleen .mailsignature bestanden. Hoe nu verder?

  • Liloe
    22 augustus 2014 om 13:17

    Dag,

    Ik krijg het ook niet voor elkaar. Ik hoef echt geen spannende handtekening, enkel tekst, maar wat ik ook doe, bij het versturen van Apple Mail naar Outlook wordt het font omgezet van Arial naar Times New Roman, soms ook dikgedrukt, ziet er werkelijk niet uit.

    Ben naar mijn idee veel te lang bezig met zoiets onbenulligs, wie heeft hier de gouden tip?

  • esther
    21 november 2014 om 13:28

    Twee cruciale vragen:

    In welke applicatie ontwerp je de handtekening?
    Hoe open je het ontwerp vervolgens in je browser?

    Groet
    Esther Verwoord

  • Ties
    6 januari 2015 om 2:18

    Hallo Richard,

    de styles aangegeven in de html worden niet weergeven in de mail als ik aangeef welke handtekening ik wil toevoegen, zelfs niet als ik bij elke style bij elk gegeven !important zet

  • Roy
    10 mei 2016 om 13:34

    Het enige wat mij heeft geholpen om de mac mails goed te laten tonen (fonts, attachments ed) bij andere clients is de plugin ‘Universal Mailer’ voor de mail.app. Plaatjes moeten, zoals hier boven al aangegeven, op een bereikbare server staan dus niet lokaal.

    Lang naar gezocht en werkt perfect!

  • Vicky
    9 januari 2017 om 9:35

    Ik heb voor 5 collega’s een HTML handtekening gemaakt. Bij 4 handtekeningen werkt alles perfect, maar bij 1 handtekening krijg ik alleen de tekst te zien en geen afbeeldingen. Ze zijn exact hetzelfde, behalve de naam van de persoon en in 5 verschillende accounts. Weet iemand wat het probleem kan zijn?

Een reactie toevoegen:

Ik ga akkoord dat deze gegevens worden opgeslagen [privacy]



Download gratis de appletips app
voor iPhone en iPad in de App Store