Importer vos emails dans Braze

Emailify intègre Braze : importez des emails HTML directement depuis le plugin Figma dans vos modèles Braze.

Tutoriel vidéo : importer vos emails dans Braze

Cette vidéo montre comment importer dans Braze des emails HTML créés avec le plugin Figma Emailify.

Dans le panneau d’export d’Emailify, sélectionnez l’option Braze (API) dans la liste déroulante, puis collez une clé API et une région de point de terminaison REST Braze valides, que vous pouvez trouver et générer depuis votre tableau de bord Braze.

Pour créer des emails dans Braze, vous aurez besoin d’une clé API Braze disposant de l’autorisation templates.email.create.

Quand vous êtes prêt, cliquez sur le bouton Upload To Braze pour exporter en HTML les emails sélectionnés dans Figma et les importer automatiquement dans vos modèles marketing Braze. Pour les consulter, connectez-vous à votre compte Braze, cliquez sur l’élément Templates de la barre latérale, puis sur Email Templates, choisissez l’option HTML Editor et parcourez la liste Saved HTML Templates en dessous.

Important : désactiver le réglage Inline CSS ​

Si le réglage Inline CSS de Braze est actif dans votre compte Braze, celui-ci retraite votre HTML en déplaçant les styles d’une feuille de style CSS vers le corps de votre email HTML, une opération déjà effectuée par Emailify. Si ce réglage est activé, il supprimera donc d’autres styles et cassera une partie de votre mise en page sur mobile et sur desktop.

Vérifiez que l’option Enable Inline CSS de la section Sending Settings -> Advanced est désactivée. Emailify intègre automatiquement les styles en ligne et minifie le HTML : le retraiter dans Braze cassera le code.

Pour désactiver Inline CSS sur un seul email, ouvrez l’onglet Edit Sending Info -> Advanced du Drag & Drop Editor de Braze et désactivez Inline CSS. Vous pouvez aussi le régler globalement dans Braze via Settings -> Email Preferences.

Sur une ancienne version de Braze, le réglage global Inline CSS (à désactiver) se trouve dans Manage Settings -> Email Settings -> Inline CSS.

Mettre à jour les modèles Braze importés depuis Emailify ​

Si vous souhaitez que vos modèles Braze soient automatiquement mis à jour au lieu d’être recréés à chaque fois, vous pouvez activer l’option Enable Updatable Templates dans les réglages d’export du plugin (lorsque l’option Braze (API) est sélectionnée).

Une valeur brazeTemplateId est alors automatiquement ajoutée au nom du calque du frame Figma importé, puis réutilisée lorsque ce même frame est de nouveau importé dans Braze via l’API lors du prochain export depuis le plugin.

Remarque : vous devez vérifier que l’option Enable Updatable Templates est activée avant d’importer votre modèle initial, car c’est ainsi que l’ID du modèle Braze (Braze Template ID) d’origine est ajouté au nom de votre frame Figma. Cet ID servira ensuite à chaque nouvel import pour mettre à jour ce même modèle dans votre compte Braze (au lieu d’en créer un nouveau à chaque fois), à condition que l’option Enable Updatable Templates reste elle aussi activée.

Pour mettre à jour des emails dans Braze, vous aurez besoin d’une clé API Braze disposant de l’autorisation templates.email.update.

Pour transformer n’importe lequel de vos liens Emailify en lien universel pour SparkPost, ajoutez [[data-msys-sublink='open-in-app']] à la fin de votre URL (par exemple, http://www.example.com[[data-msys-sublink='open-in-app']]). L’attribut de données data-msys-sublink sera alors automatiquement ajouté à votre balise de lien <a> (par exemple, <a href="https://example.com" data-msys-sublink="open-in-app">).

Vérifiez ensuite que votre application est configurée pour gérer correctement ce chemin personnalisé. Consultez l’article de SparkPost Using SparkPost click tracking on deep links, qui contient des exemples de code pour iOS et Android.

Pour transformer n’importe lequel de vos liens Emailify en lien universel pour SendGrid, ajoutez [[universal='true']] à la fin de votre URL (par exemple, http://www.example.com[[universal='true']]). L’attribut de données universal sera alors automatiquement ajouté à votre balise de lien <a> (par exemple, <a href="https://example.com" universal="true">).

Vérifiez ensuite que votre application est configurée pour gérer correctement ce chemin personnalisé. Consultez l’article de SendGrid Using SendGrid click tracking on deep links, qui contient des exemples de code pour iOS et Android.