Icons in Email-Briefpapieren: Frage zum Wiki-Artikel ‚Icon-Fonts‘

problematische Seite

Ich wollte ein paar icons in mein email-Briefpapier (für Thunderbird) einfügen. Dazu habe ich ein html-File erstellt. Im Browser wird alles korrekt anbezeigt. Aber sobald ich das file als Briefpapier im Thunderbird verwende, verschwinden die Logos/werden nicht angezeigt. Woran liegt das?

Das ist mein <head>-Eintrag:


<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">

Das ist der content-Eintrag:

<p class="logos">
<a href="#"><i class="fa fa-home"></i></a>
<a href="#"><i class="fa fa-envelope"></i></a>
<a href="#"><i class="fa fa-skype"></i></a>
<a href="#"><i class="fa fa-facebook-official"></i></a>
<a href="#"><i class="fa fa-google-plus-square"></i></a>
<a href="#"><i class="fa fa-twitter"></i></a>
<a href="#"><i class="fa fa-instagram"></i></a>
<a href="#"><i class="fa fa-xing-square"></i></a>
<a href="#"><i class="fa fa-linkedin-square"></i></a>
<a href="#"><i class="fa fa-paypal"></i></a>
</p>
  1. problematische Seite

    Hallo

    Ich wollte ein paar icons in mein email-Briefpapier (für Thunderbird) einfügen. Dazu habe ich ein html-File erstellt. Im Browser wird alles korrekt anbezeigt. Aber sobald ich das file als Briefpapier im Thunderbird verwende, verschwinden die Logos/werden nicht angezeigt. Woran liegt das?

    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
    

    Daran, dass das Nachladen von Inhalten von außerhalb der Email in den meisten Email-Clients (a.k.a. lokale EMailprogramme) standardmäßig nicht erlaubt ist. Du bist also davon abhängig, dass der Benutzer des Email-Clients dieses Nachladen erlaubt.

    Ich vermute, dass ein nicht unerheblicher Teil der Benutzer von Email-Clients das Nachladen abgeschaltet hat und für deine Emails auch nicht einschalten wird. Ich würde mir wegen der Unwägbarkeiten an deiner Stelle diese Arbeit sparen.

    Tschö, Auge

    --
    Wir hören immer wieder, dass Regierungscomputer gehackt wurden. Ich denke, man sollte die Sicherheit seiner Daten nicht Regierungen anvertrauen.
    Jan Koum, Mitgründer von WhatsApp, im Heise.de-Interview
  2. die Lösung für dein Problem ist du Musst dir ein Style Element in deine E-Mail einbauen in denen deine icons im css Style definierst.

    die Pfade zu den Icons must du lokal legen.

    file:///C:/Meinpfad/BG.gif
    

    die bilder werden dann in Base64 codiert und an die e-mail drangehängt.

    [EDIT] btw. könntest du probieren, die font-awesome.min.css Datei lokal im header zu verlinken. Da bin ich mir aber nicht sicher ob dies das mail probgram richtig interpretiert. sprich die bilder der Icons die in der *.css datei stehen Base64 codiert. einfach mal ausprobieren. Es ist einfach nur WICHTIG, das du lokale Pfade für dein Briefpapier verwendest.

    1. Hallo Marcus Strauß,

      die Pfade zu den Icons must du lokal legen.

      file:///C:/Meinpfad/BG.gif
      

      Und auf jedem Rechner, auf dem die Mail aufschlägt, gibt es dann auch C:/Meinpfad/BG.gif?

      Bis demnächst
      Matthias

      --
      Wenn eine Idee nicht zuerst absurd erscheint, taugt sie nichts. (Albert Einstein)
      1. Und auf jedem Rechner, auf dem die Mail aufschlägt, gibt es dann auch C:/Meinpfad/BG.gif?

        Falsch Das Email prog liest die Pfade ein... Wandelt die Bilder in base64 Code um und hängt die Bilder in die Email als unsichtbaren angang. Der Pfad wird durch das Email programm abgeändert...

        Etwa in der Form Rechnername@bg.gif

        Das Bild erhält in der Email den gleichen Namen.

        Somit weis das Email prog vom Empfänger wo das Bild hingehört.

        Imo. Bin ich in der Arbeit. Ich muss morgen mal kucken ob ich da noch ein paar Links habe wo das genau erklärt wird. Aber du kannst mir glauben dass das so funzt... Den ich verschicke so auch Emails.

        1. Hier die Links

          http://www.drweb.de/magazin/aufbau-von-mime-mails-2/

          http://stackoverflow.com/questions/10631856/mime-type-to-satisfy-html-email-images-and-plain-text