E-Mails des alten Editors in Email Designer konvertieren converting-an-html-content
Beginnen Sie mit Email Designer zu arbeiten und erstellen Sie wiederverwendbare Vorlagen und Fragmente aus dem im alten Editor generierten E-Mail-HTML-Code.
Dieser Anwendungsfall ermöglicht es Ihnen, eine Email Designer-Vorlage zu erstellen, indem Sie eine HTML-E-Mail verwenden und sie in Email Designer in HTML-Komponenten aufteilen.
E-Mail-Inhalte vorbereiten
- Wählen Sie eine HTML-E-Mail aus.
- Identifizieren Sie Abschnitte, um die HTML-E-Mail zu unterteilen.
- Schneiden Sie die verschiedenen Blöcke aus Ihrer HTML-E-Mail aus.
E-Mail-Struktur erstellen
- Öffnen Sie Email Designer, um leeren E-Mail-Inhalt zu erstellen.
- Legen Sie die Attribute für den Hauptteil fest: Hintergrundfarben, Breite etc. Weiterführende Informationen dazu finden Sie im Abschnitt E-Mail-Stile bearbeiten.
- Fügen Sie so viele Strukturkomponenten hinzu, wie Sie Abschnitte haben. Weiterführende Informationen dazu finden Sie im Abschnitt zum Bearbeiten des E-Mail-Aufbaus.
HTML-Inhalt hinzufügen
- Fügen Sie zu jeder Strukturkomponente eine HTML-Komponente hinzu. Weiterführende Informationen dazu finden Sie im Abschnitt Fragmente und Inhaltskomponenten hinzufügen.
- Fügen Sie Ihren HTML-Code in jede Komponente ein.
Stil Ihrer E-Mail verwalten manage-the-style-of-your-email
-
Wechseln Sie zur Mobile-Ansicht. Weiterführende Informationen hierzu finden Sie in diesem Abschnitt.
-
Um dieses Problem zu beheben, wechseln Sie zum Quellcode-Modus und kopieren Sie Ihren CSS-Abschnitt in einen neuen CSS-Abschnitt. Beispiel:
code language-none <style type="text/css"> a {text-decoration:none;} body {min-width:100% !important; margin:0 auto !important; padding:0 !important;} img {line-height:100%; text-decoration:none; -ms-interpolation-mode:bicubic;} ... </style>note note NOTE Stellen Sie sicher, dass Sie Ihren Stil nach diesem Abschnitt in einem anderen CSS-Tag hinzufügen. Verändern Sie das von Email Designer erzeugte CSS nicht: <style data-name="default" type="text/css">(##)</style><style data-name="supportIOS10" type="text/css">(##)</style><style data-name="mediaIOS8" type="text/css">(##)</style><style data-name="media-default-max-width-500px" type="text/css">(##)</style><style data-name="media-default--webkit-min-device-pixel-ratio-0" type="text/css">(##)</style>
-
Kehren Sie zur mobilen Ansicht zurück und prüfen Sie, ob Ihr Inhalt korrekt angezeigt wird, und speichern Sie Ihre Änderungen.
Anwendungsbeispiel
Hier wird diese im alten Editor erstellte E-Mail in eine Email Designer-Vorlage konvertiert.
Abschnitt Ihrer E-Mail identifizieren
Wir können 11 Abschnitte in dieser E-Mail identifizieren.
Um zu ermitteln, welches Element welcher Abschnitt des HTML-Codes ist, können Sie es auswählen.
Um die HTML-Version der E-Mail anzuzeigen, klicken Sie auf Quelle anzeigen.
E-Mail-Vorlage und deren Struktur erstellen
-
Ziehen Sie Strukturkomponenten in den Arbeitsbereich, die das Layout der E-Mail widerspiegeln.
-
Wiederholen Sie diese Schritte so oft wie nötig. Für dieses Beispiel müssen elf Strukturkomponenten erstellt werden.
HTML-Inhaltskomponenten einfügen
-
Fügen Sie in jede Strukturkomponente eine HTML-Komponente ein.
-
Klicken Sie für jeden Abschnitt auf Quellcode anzeigen.
-
Fügen Sie den HTML-Abschnitt ein.
-
Wählen Sie Speichern aus.
Sie können nun das Rendering Ihrer E-Mail überprüfen.
Stile für die Ansicht auf Mobilgeräten verwalten
-
Fügen Sie CSS-Elemente ein, um sicherzustellen, dass Ihre E-Mail für die Ansicht auf Mobilgeräten geeignet ist.
-
Wechseln Sie zum Quellcode und kopieren Sie Ihren Stilabschnitt in einen neuen Stilabschnitt.
Weitere Informationen finden Sie unter Stil Ihrer E-Mail verwalten.
Ihre alte E-Mail ist jetzt in Email Designer verfügbar.