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

  • 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?

    Beantwoorden
  • 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!

    Beantwoorden
  • 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

    Beantwoorden
  • Twee cruciale vragen:

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

    Groet
    Esther Verwoord

    Beantwoorden
  • 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?

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

    Beantwoorden
  • 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.

    Beantwoorden
  • 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.

    Beantwoorden
  • 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!!

    Beantwoorden
  • 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:

    Beantwoorden
  • 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/

    Beantwoorden
  • 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.

    Beantwoorden
  • 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

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

    preview bij voorkeuren is wel zichtbaar.

    Beantwoorden
  • 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

    Beantwoorden
  • 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.

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

    Beantwoorden
  • 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

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

    Beantwoorden
  • 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

    Beantwoorden
  • 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.

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

    –R

    Beantwoorden
  • 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

    Beantwoorden
  • 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

    Beantwoorden
  • 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 ?

    Beantwoorden
  • 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.

    Beantwoorden
  • 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?

    Beantwoorden
  • 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

    Beantwoorden
  • ”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.

    Beantwoorden
  • 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/

    Beantwoorden
  • 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.

    Beantwoorden
  • 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

    Beantwoorden
  • 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]

    Beantwoorden
  • 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??

    Beantwoorden
  • 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

    Beantwoorden
  • 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.

    Beantwoorden

Laat een reactie achter



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