Exportierte E-Mail-Bilder hosten

Hoste deine exportierten Bilddateien selbst oder lass sie von Emailify automatisch in unser eigenes CDN hochladen.

Das Bild-Hosting-CDN von Emailify nutzen (Standard) ​

Bei HTML-Exporten speichert Emailify standardmäßig alle Bilder neben den .html-Dateien. So kannst du sie hochladen, wo immer du willst.

Wenn deine Bilder stattdessen im CDN (Content Delivery Network) von Emailify gehostet werden sollen, aktiviere den Schalter Upload Hosted Image URLs. Dann werden deine Bilder hochgeladen, und die URLs in deiner HTML-E-Mail werden automatisch so ersetzt, dass sie auf die hochgeladenen Dateien zeigen.

Wenn du eine der integrierten Integrationen für E-Mail-Marketing-Plattformen nutzt, werden deine Bilder automatisch in das CDN von Emailify hochgeladen.

Warum ein gehostetes Bild größer sein kann als die Quelldatei ​

Emailify rendert die Bilddaten, die die exportierte E-Mail nutzt, und optimiert das erzeugte PNG oder JPG, bevor genau diese Datei dem Export hinzugefügt und, falls aktiviert, hochgeladen wird. Das Hosting ändert nur die URL. Es findet kein separater Komprimierungsschritt statt.

Da Figma gerenderte Exportdaten liefert und nicht die ursprünglich hochgeladene Datei, ist die gehostete Datei keine bytegenaue Kopie des Quell-JPG oder -PNG. Ihre Größe kann abweichen und auch größer sein. Um das Ergebnis zu verkleinern, nutze vor dem Export eine passend dimensionierte Quellebene und ein geeignetes Bildformat. Die exakte Komprimierung der Originaldatei kann Emailify in diesem Workflow nicht übernehmen.

Bild-Assets in deinen eigenen Cloud-Storage-Bucket hochladen ​

Standardmäßig hostet Emailify deine Bilder im CDN (Content Delivery Network) von Emailify. Optional kannst du stattdessen einen Bucket bei deinem eigenen Cloud-Storage-Dienst nutzen (zum Beispiel AWS S3 oder Backblaze B2).

Sobald du den gewünschten Bild-Hosting-Dienst ausgewählt hast, gibst du darunter die Zugangsdaten und Details deines Buckets ein. Beim Export werden deine Bild-Assets dann automatisch in deinen eigenen Bucket hochgeladen (und der Bildpfad deines Buckets wird in den src-Attributen der <img>-Tags deines HTML verwendet):

  • Region (zum Beispiel us-east-1)
  • Access Key (zum Beispiel 003g8...)
  • Secret Access Key (zum Beispiel K454q...)
  • Bucket Name (zum Beispiel my-emailify-bucket)
  • Bucket URL (zum Beispiel https://my-emailify-bucket.s3.us-east-1.amazonaws.com/)

Achte darauf, dass alle Buckets, die du anlegst, Leserechte mit Public-Zugriff haben. Sonst sind die hochgeladenen Bild-URLs nicht erreichbar, wenn die HTML-E-Mail versendet wird.

Adressen für Cloudflare R2 ​

R2 nutzt zwei getrennte Adressen. Trag beide in den Einstellungen für das Bild-Hosting ein:

  • S3 API endpoint: Kopiere den Endpunkt aus deinem Cloudflare-Konto, zum Beispiel https://accountid.r2.cloudflarestorage.com. Behalte ein von Cloudflare angezeigtes Segment für die Gerichtsbarkeit bei, etwa .eu. Trag den Namen deines Buckets unter R2 Bucket Name ein.
  • Public image URL: Nutze eine mit dem Bucket verbundene eigene Domain, zum Beispiel https://images.example.com/, oder die aktivierte öffentliche r2.dev-URL des Buckets. Der S3-API-Endpunkt erfordert eine Authentifizierung und kann in einer E-Mail nicht als öffentliche Bild-URL dienen.

Wenn du den S3-API-Endpunkt früher im URL-Feld gespeichert hast, verschiebt Emailify ihn nach S3 API endpoint. Ergänze vor dem nächsten Export deine öffentliche Bild-URL. Hast du bereits eine öffentliche Domain gespeichert, bleibt sie erhalten. Ergänze dann den separaten API-Endpunkt, falls er fehlt. Deine Zugangsschlüssel und der Bucket-Name bleiben erhalten.

Siehe Cloudflares Anleitung zum S3-API-Endpunkt und die Anleitung zum öffentlichen Bucket-Zugriff.

Fehler beim Bild-Hosting in Mailchimp ​

Beim direkten Export zu Mailchimp prüft Emailify den Bildordner, vorhandene Dateien und hochgeladene Bild-URLs. Lehnt Mailchimp eine Bildanfrage ab, meldet der Export den Fehler und erstellt die Vorlage nicht mit unbestätigten Bild-URLs. Prüf deine Mailchimp-Verbindung und deinen API-Schlüssel und exportiere dann erneut.

Unterstützte Cloud-Storage-Dienste zum Selbsthosten in Emailify ​

Du kannst die aus Emailify exportierten Bilder bei jedem der folgenden S3-kompatiblen Object-Storage-Dienste selbst hosten:

Eigene Basis-URL festlegen, um exportierte E-Mail-Bilder auf deinem Server oder CDN zu hosten ​

Standardmäßig ist src bei allen Bildern im von Emailify exportierten HTML ein relativer Pfad img/ (zum Beispiel img/ceb3f891b78815897e04299f93eef255.jpg). So kannst du deine E-Mail prüfen und ein ZIP auf bestimmte Plattformen wie MailChimp hochladen, die die Bilder automatisch hochladen und die src-URLs für dich aktualisieren.

Wenn deine Plattform diese Funktion aber nicht unterstützt oder du die Bilder einfach auf deinem eigenen Server hostest, kannst du stattdessen eine eigene Basis-URL festlegen.

Eigene Basis-URL pro E-Mail ​

Für einzelne E-Mails legst du eine eigene Basis-URL fest, indem du den Haupt-Frame der E-Mail in Figma auswählst, im Kopfbereich des Plugins auf den Button Settings klickst, den Schalter Override "img/" Base Path aktivierst und den Basispfad einfügst, unter dem die Bilder gehostet werden. Ist die eigene Basis-URL aktiviert, wird sie automatisch allen src-Attributen deiner Bilder vorangestellt (zum Beispiel wird img/ in der exportierten HTML-Datei durch https://your-custom-server.com/image/path/here/ ersetzt).

Diese Einstellung pro E-Mail eignet sich, wenn du für bestimmte Kampagnen unterschiedliche Basis-URLs brauchst oder die globale CDN-Einstellung für einzelne E-Mails überschreiben willst.

Globale eigene CDN-Basis-URL ​

Wenn du Bilder für alle deine E-Mails immer auf demselben eigenen CDN oder Server hostest, kannst du eine globale eigene Basis-URL festlegen, statt sie für jede E-Mail einzeln einzurichten:

  1. Such im Panel mit den Exporteinstellungen das CDN-Dropdown.
  2. Wähl in der Liste der CDN-Optionen Custom Base Image Path URL.
  3. Gib deine eigene Basis-URL in das Eingabefeld ein, das erscheint (z. B. https://cdn.example.com/images/).
  4. Alle exportierten E-Mails verwenden diese Basis-URL dann standardmäßig für Bildpfade.

Mit der globalen CDN-Einstellung vereinheitlichst du das Bild-Hosting bequem über alle deine E-Mail-Kampagnen hinweg. Sind sowohl eine globale als auch eine eigene Basis-URL pro E-Mail festgelegt, hat die Einstellung pro E-Mail Vorrang. So kannst du das globale CDN bei Bedarf für bestimmte Kampagnen überschreiben.

Egal ob du die globale Einstellung oder die pro E-Mail nutzt: Deine eigene Basis-URL muss öffentlich erreichbar und bei Bedarf mit passenden CORS-Einstellungen konfiguriert sein. Die URL kann mit oder ohne abschließenden Schrägstrich angegeben werden – Emailify verarbeitet beide Formate korrekt.

Warum werden Bilder in meiner exportierten HTML-E-Mail nicht angezeigt? ​

Bilder in E-Mails werden nach dem Versand meist dann nicht angezeigt, wenn die Bilddateien nicht unter öffentlichen Online-URLs gehostet sind, die E-Mail mit einem Tool versendet wurde, das das HTML umgeschrieben hat, oder der E-Mail-Client des Empfängers externe Bilder blockiert hat.

Wenn du HTML mit lokalen img/-Pfaden exportierst, werden die Bilder neben der .html-Datei gespeichert und müssen mit der E-Mail-Vorlage hochgeladen oder separat gehostet werden. Wenn du Upload Hosted Image URLs aktivierst, lädt Emailify die Bilder hoch und ersetzt die Bild-URLs im HTML automatisch durch gehostete Links.

Warum funktionieren Bilder lokal, aber nicht nach dem Versand? ​

Eine lokale HTML-Vorschau kann Bilder aus dem exportierten img/-Ordner auf deinem Computer laden. Nach dem Versand haben Empfänger keinen Zugriff auf Dateien auf deinem Computer. Die Bilder müssen also online gehostet oder über deinen ESP hochgeladen werden.

Gmail und Outlook eignen sich nicht zuverlässig zum Versand von exportiertem eigenem HTML, weil sie das Markup verändern können und kein Bild-Hosting für einen Workflow mit HTML-Massenmails bieten. Nutze stattdessen einen ESP oder eine der integrierten Integrationen von Emailify.

Was sollte ich zuerst prüfen, wenn exportierte Bilder fehlerhaft sind? ​

  • Stell sicher, dass die Bilder unter öffentlichen https://-URLs gehostet sind, oder lade den exportierten img/-Ordner über deinen ESP hoch.
  • Aktiviere Upload Hosted Image URLs, wenn Emailify die Bild-Assets für dich hochladen soll.
  • Wenn du einen eigenen Bucket oder ein eigenes CDN nutzt, stell sicher, dass der Bucket öffentlichen Lesezugriff auf die hochgeladenen Bild-URLs erlaubt.
  • Wenn ein Upload fehlschlägt, prüf, ob ein VPN, eine Firewall, ein Proxy oder ein Firmennetzwerk die Upload-Anfrage blockiert.
  • Warte vor dem Export, bis die Figma-Bilder in der Datei fertig geladen sind.
  • Denk daran, dass manche E-Mail-Clients externe Bilder blockieren, bis der Empfänger sie anzeigen lässt.

Verbindungsfehler beim eigenen Hosting ​

Bei Amazon S3 bildet Emailify den Upload-Endpunkt aus der ausgewählten Region und dem Bucket Name. Die Bucket URL ist die öffentliche Basis-URL für Bilder in deiner exportierten E-Mail. Wenn du sie änderst, ändert sich der Upload-Endpunkt nicht.

Gib den vollständigen Bucket-Namen ein, einschließlich Konto-ID und Regionssuffix. Ein regionaler Konto-Bucket namens my-email-images-123456789012-ap-southeast-2-an nutzt zum Beispiel die Region ap-southeast-2 und die Bucket-URL https://my-email-images-123456789012-ap-southeast-2-an.s3.ap-southeast-2.amazonaws.com/. AWS unterstützt sowohl globale als auch regionale Bucket-Namen auf Kontoebene.

Die IAM-Identität hinter deinem Access Key braucht s3:PutObject für arn:aws:s3:::YOUR-BUCKET-NAME/*, um Bilder hochzuladen. Emailify braucht keinen öffentlichen Schreibzugriff und keine Berechtigung zum Erstellen oder Löschen von Buckets. Zusätzliche Einschränkungen in deinen AWS-Richtlinien oder Verschlüsselungseinstellungen können Uploads trotzdem verhindern; siehe die Hinweise von AWS zu Berechtigungen.

Die exportierten Bild-URLs müssen außerdem ohne Anmeldung lesbar sein. Nutze einen öffentlichen Bild-Bucket oder ein öffentliches CDN, das auf deinem Bucket aufsetzt, und prüf eine einzelne hochgeladene Bild-URL in einem privaten Browserfenster. Bewahre andere private Dateien in einem separaten Speicher auf und mach sie nicht öffentlich, nur damit E-Mail-Bilder funktionieren.

Meldet ein Export Image hosting failed, behebe das Verbindungs- oder Berechtigungsproblem und starte den Export erneut. Ein erfolgreicher Upload der E-Mail-Vorlage bedeutet nicht, dass auch ihre Bilder erfolgreich hochgeladen wurden. Wenn der Fehler bestehen bleibt, schick die Fehlermeldung oder einen Screenshot an den Support, ohne deinen Access Key oder Secret Key.