Deine E-Mails zu Braze hochladen

Mit der integrierten Braze-Integration von Emailify lädst du HTML-E-Mails direkt aus dem Figma-Plugin in deine Braze-Vorlagen hoch.

Video-Tutorial: E-Mails zu Braze hochladen

Dieses Video zeigt dir, wie du HTML-E-Mails aus dem Figma-Plugin Emailify zu Braze hochlädst.

Wähl im Export-Panel von Emailify in der Dropdown-Liste die Option Braze (API) und füge dann einen gültigen API-Schlüssel und die Region des REST-Endpunkts von Braze ein. Beides findest bzw. erzeugst du in deinem Braze-Dashboard.

Um E-Mails in Braze zu erstellen, brauchst du einen Braze-API-Schlüssel mit aktivierter Berechtigung templates.email.create.

Wenn du so weit bist, klick auf den Button Upload To Braze. Emailify exportiert dann die in Figma ausgewählten E-Mails als HTML und lädt sie automatisch in deine Marketing-Vorlagen in Braze hoch. Um sie anzusehen, meldest du dich bei Braze an, klickst in der Seitenleiste auf Templates und dann auf Email Templates, wählst die Option HTML Editor und blätterst unten durch die Liste Saved HTML Templates.

Wichtig: Einstellung „Inline CSS“ deaktivieren ​

Wenn in deinem Braze-Konto die Braze-Einstellung „Inline CSS“ aktiv ist, verarbeitet Braze dein HTML erneut und verschiebt Styles aus einem CSS-Stylesheet in den Body deiner HTML-E-Mail. Das hat Emailify bereits erledigt. Ist diese Option aktiviert, werden andere Styles entfernt, und Teile deines Layouts auf Mobilgeräten und dem Desktop gehen kaputt.

Stell sicher, dass Enable Inline CSS im Bereich Sending Settings -> Advanced deaktiviert ist. Emailify setzt das CSS automatisch inline und minifiziert das HTML. Eine erneute Verarbeitung in Braze beschädigt den Code.

Um „Inline CSS“ für eine einzelne E-Mail auszuschalten, öffne im Drag-&-Drop-Editor von Braze den Tab Edit Sending Info -> Advanced und deaktiviere Inline CSS. Global lässt sich das in Braze auch unter Settings -> Email Preferences einstellen.

In einer älteren Version von Braze findest du den globalen Schalter für „Inline CSS“ (zum Ausschalten) unter Manage Settings -> Email Settings -> Inline CSS.

Aus Emailify hochgeladene Braze-Vorlagen aktualisieren ​

Wenn deine Braze-Vorlagen automatisch aktualisiert statt bei jedem Upload neu angelegt werden sollen, kannst du in den Exporteinstellungen des Plugins den Schalter Enable Updatable Templates aktivieren (wenn die Option Braze (API) ausgewählt ist).

Damit wird automatisch ein brazeTemplateId-Wert an den Ebenennamen des hochgeladenen Figma-Frames angehängt. Wird derselbe Frame beim nächsten Export aus dem Plugin erneut über die API zu Braze hochgeladen, wird diese ID wiederverwendet.

Hinweis: Der Schalter Enable Updatable Templates muss schon vor dem Upload deiner ersten Vorlage aktiviert sein. Nur dann wird die Braze Template ID der ursprünglich zu Braze hochgeladenen Vorlage an den Namen deines Figma-Frames angehängt. Diese ID wird dann bei allen künftigen Uploads genutzt, um dieselbe Vorlage in deinem Braze-Konto zu aktualisieren (statt jedes Mal eine neue anzulegen) – vorausgesetzt, der Schalter Enable Updatable Templates bleibt ebenfalls aktiviert.

Um E-Mails in Braze zu aktualisieren, brauchst du einen Braze-API-Schlüssel mit aktivierter Berechtigung templates.email.update.

Um einen deiner Emailify-Links in einen Universal Link für SparkPost umzuwandeln, häng [[data-msys-sublink='open-in-app']] an das Ende deiner URL an (zum Beispiel http://www.example.com[[data-msys-sublink='open-in-app']]). Das Data-Attribut data-msys-sublink wird dann automatisch in dein <a>-Link-Tag eingefügt (zum Beispiel <a href="https://example.com" data-msys-sublink="open-in-app">).

Stell dann sicher, dass deine App den eigenen Pfad richtig verarbeitet. Sieh dir dazu den Artikel von SparkPost zur Verwendung des SparkPost-Klick-Trackings bei Deep Links an. Er enthält Beispielcode für iOS und Android.

Um einen deiner Emailify-Links in einen Universal Link für SendGrid umzuwandeln, häng [[universal='true']] an das Ende deiner URL an (zum Beispiel http://www.example.com[[universal='true']]). Das Data-Attribut universal wird dann automatisch in dein <a>-Link-Tag eingefügt (zum Beispiel <a href="https://example.com" universal="true">).

Stell dann sicher, dass deine App den eigenen Pfad richtig verarbeitet. Sieh dir dazu den Artikel von SendGrid zur Verwendung des SendGrid-Klick-Trackings bei Deep Links an. Er enthält Beispielcode für iOS und Android.