Über die Inhaltserstellung in E-Mails

Verwenden Sie die Drag & Drop-Benutzeroberfläche von Email Designer, um E-Mail-Inhalt in Adobe Campaign zu erstellen und zu bearbeiten.

In diesem Abschnitt wird Email Designer genauer beschrieben:

Weiterführende Informationen zu den wichtigsten Marketingaktivitäten finden Sie in diesen Abschnitten:

Über Email Designer

Email Designer ermöglicht die Erstellung von E-Mail-Inhalten und Vorlagen für E-Mail-Inhalte. Der Editor ist kompatibel mit einfachen E-Mails, Transaktions-E-Mails, A/B-Test-E-Mails, mehrsprachigen E-Mails und wiederkehrenden E-Mails.

Wenn Sie erfahren möchten, wie Sie eine völlig neue E-Mail mit Email Designer erstellen können, sehen Sie sich dieses Einführungsvideo an.

Benutzeroberfläche von Email Designer

Email Designer verfügt über zahlreiche Optionen zur Erstellung, Bearbeitung und Anpassung von Inhalten.

Die Benutzeroberfläche besteht aus mehreren Bereichen mit unterschiedlichen Funktionen:

email_designer_overview

Sie können mit Drag & Drop Strukturkomponenten und Inhaltsfragmente aus den verfügbaren Elementen in der Palette (3) in den Arbeitsbereich (1) verschieben. Danach können Sie eine Komponente oder ein Element im Arbeitsbereich (1) auswählen und im Fenster Einstellungen (2) Stil und Aussehen anpassen.

In der Symbolleiste (4) sind weitere allgemeine Optionen und Einstellungen verfügbar.

Hinweis:

Der Bereich Einstellungen kann abhängig von Ihrer Bildschirmauflösung und Anzeige nach links verschoben werden.

In der dedizierten Symbolleiste der Editor-Oberfläche sind je nach markiertem Bereich unterschiedliche Schaltflächen verfügbar. Sie enthält Aktionsschaltflächen sowie Schaltflächen zur Anpassung des Textstils. Alle Änderungen beziehen sich somit jeweils nur auf das ausgewählte Element.

Allgemeine Empfehlungen für die Verwendung von Email Designer

Um Email Designer optimal zu nutzen und E-Mails möglichst einfach zu erstellen, empfehlen wir folgende Vorgehensweise:

  • Verwenden Sie Inline Styling anstatt eines separaten CSS-Stylesheets und CSS im <head>-Abschnitt einer HTML-Datei. Die Verwendung von Inline Styling ermöglicht eine optimale Speicherung und Wiederverwendung der Inhaltsfragmente.

    Siehe auch den Abschnitt zum Hinzufügen von Inline-Styling-Attributen.

  • Die einfache Erstellung und Wiederverwendung von Inhaltsfragmenten hilft Ihnen, Ihre Marketingkampagnen konsistent zu halten und damit Ihr Branding zu stärken.

Kompatibilitätsmodus von Email Designer

Beim Hochladen von Inhalt muss dieser ein bestimmtes Tagging aufweisen, um vollständig kompatibel und im WYSIWYG-Editor von Email Designer bearbeitbar zu sein. Weiterführende Informationen zu diesem speziellen Tagging finden Sie in diesem Abschnitt.

Wenn die hochgeladenen HTML-Datei oder Teile davon nicht mit dem Tagging kompatibel ist, wird der Inhalt im so genannten Kompatibilitätsmodus geladen, in dem die Bearbeitungsmöglichkeiten über die Benutzeroberfläche eingeschränkt sind.

Im Kompatibilitätsmodus können Sie die folgenden Änderungen über die Benutzeroberfläche vornehmen (nicht verfügbare Aktionen sind verborgen):

  • Ändern des Textes oder eines Bildes

  • Einfügen von Links und Personalisierungsfeldern

  • Bearbeiten einiger Stiloptionen im ausgewählten HTML-Baustein

  • Definieren von bedingten Inhalten

email_designer_compatibility

Sonstige Änderungen, wie etwa das Hinzufügen neuer Bereiche zu Ihrer E-Mail oder deren zusätzliche Gestaltung, müssen direkt im Quellcode der E-Mail im HTML-Modus vorgenommen werden.

Neuen E-Mail-Inhalt gestalten

Dies sind die wichtigsten Schritte zum Erstellen und Gestalten eines neuen E-Mail-Inhalts mithilfe von Email Designer:

  1. Erstellen Sie eine E-Mail und öffnen Sie ihren Inhalt.

  2. Fügen Sie Strukturkomponenten hinzu, um der E-Mail die gewünschte Form zu geben. Siehe auch den Abschnitt E-Mail-Struktur bearbeiten

  3. Fügen Sie Inhaltskomponenten und Fragmente in die Strukturkomponenten ein. Siehe auch den Abschnitt Fragmente und Inhaltskomponenten hinzufügen

  4. Fügen Sie Bilder hinzu und bearbeiten Sie den Text der E-Mail. Siehe Bilder einfügen.

  5. Personalisieren Sie Ihre E-Mail durch Hinzufügen von Personalisierungsfeldern, Links etc. Siehe Personalisierungsfelder einfügen, Link einfügen und Dynamische Inhalte in einer E-Mail definieren.

  6. Definieren Sie die Betreffzeile Ihrer E-Mail. Siehe Betreffzeile einer E-Mail personalisieren.

  7. Sehen Sie sich die E-Mail in der Vorschau an.

  8. Speichern Sie den Inhalt und fahren Sie mit der Nachricht fort, nachdem Sie eine Audience definiert und den Versandzeitpunkt festgelegt haben.

Sehen Sie sich dazu auch dieses Einführungsvideo an.

Hinweis:

Wenn Sie keinen völlig neuen E-Mail-Inhalt erstellen möchten, können Sie auch die nativen Inhaltsvorlagen verwenden. Weiterführende Informationen dazu finden Sie im Abschnitt Inhaltsvorlagen.

Verwandte Themen:

Zur Mobile-Ansicht wechseln

Sie können das responsive Design einer E-Mail anpassen, indem Sie alle Stiloptionen für die Darstellung auf Mobilgeräten einzeln bearbeiten. So können Sie beispielsweise für die mobile Version Ihrer E-Mail die Spannen und Abstände verändern sowie kleinere oder größere Schriftgrade oder unterschiedliche Hintergrundfarben auswählen.

Alle Stiloptionen sind in der Mobile-Ansicht verfügbar. Weiterführende Informationen zu den Stileinstellungen von Email Designer finden Sie im Abschnitt E-Mail-Stile bearbeiten.

  1. Erstellen Sie eine E-Mail und bearbeiten Sie den Inhalt. Weiterführende Informationen dazu finden Sie im Abschnitt Neuen E-Mail-Inhalt gestalten.

  2. Öffnen Sie mit der Schaltfläche Zur Mobile-Ansicht wechseln die Mobile-Ansicht.

    email_designer_mobile_view_switch

    Die Mobile-Version der E-Mail wird angezeigt. Sie enthält alle in der Desktop-Ansicht definierten Komponenten und Stile.

    email_designer_mobile_view
  3. Sie können alle Stileinstellungen unabhängig voneinander bearbeiten, z. B. Hintergrundfarbe, Ausrichtung, Abstand, Spanne, Schriftart, Textfarbe usw.

  4. Änderungen von Stileinstellungen in der Mobile-Ansicht werden nur auf die Mobile-Version angewendet.

    Sie können in der Mobile-Ansicht z. B. die Größe eines Bildes verringern, einen grünen Hintergrund hinzufügen und den Abstand verändern.

    email_designer_mobile_view_change
  5. Wählen Sie nochmals die Schaltfläche Zur Mobile-Ansicht wechseln aus, um zur Desktop-Ansicht zu wechseln. Die soeben vorgenommenen Stiländerungen sind in dieser Version nicht vorhanden.

    email_designer_mobile_view_desktop_no-change

    Hinweis:

    Die einzige Ausnahme sind die Einstellungen für Inline-Stile. Inline-Stil-Einstellungen werden auch von der standardmäßigen Desktop-Ansicht übernommen.

  6. Andere Änderungen an der Struktur oder am Inhalt der E-Mail, wie zum Beispiel Textänderungen, der Upload eines neuen Bildes, das Hinzufügen einer neuen Komponente etc. werden auch in der Standardansicht angezeigt.

    Wechseln Sie wieder in die Mobile-Ansicht und ändern Sie z. B. Text und ersetzen Sie ein Bild.

    email_designer_mobile_view_change_content

    Wählen Sie nochmals die Schaltfläche Zur Mobile-Ansicht wechseln aus, um zur Desktop-Ansicht zu wechseln. Die Änderungen wurden übernommen.

    email_designer_mobile_view_desktop_content-change
  7. Wenn Sie in der Mobile-Version einen Stil entfernen, wird der im Desktop-Modus angewendete Stil übernommen.

    Fügen Sie in der Desktop-Ansicht z. B. für eine Schaltfläche eine graue Hintergrundfarbe ein.

    email_designer_mobile_view_background_desktop
  8. Wechseln Sie in die Mobile-Ansicht und wählen Sie für dieselbe Schaltfläche einen grünen Hintergrund.

    email_designer_mobile_view_background_mobile
  9. Deaktivieren Sie in der Mobile-Ansicht die Einstellung Hintergrundfarbe.

    email_designer_mobile_view_background_mobile_disabled

    Die in der Desktop-Ansicht ausgewählte Hintergrundfarbe wird noch immer angewendet: Die Schaltfläche wird grau (nicht farblos) dargestellt.

    Die einzige Ausnahme ist die Einstellung für die Randfarbe. Wenn diese in der Mobile-Ansicht deaktiviert ist, wird kein Rahmen mehr hinzugefügt, selbst wenn in der Desktop-Ansicht eine Randfarbe definiert wird.

Text- und HTML-Modus

Textversion der E-Mail erstellen

Standardmäßig wird eine reine Textversion Ihrer E-Mail automatisch erzeugt und mit der bearbeiteten Version synchronisiert.

Sie können die Synchronisation in der Textversion-Ansicht Ihrer E-Mail über die Option Mit HTML synchronisieren deaktivieren.

email_designer_textversion

Auch die zur HTML-Version hinzugefügten Personalisierungsfelder werden mit der Textversion synchronisiert.

Die Inhaltsquelle einer E-Mail in HTML bearbeiten

Für fortgeschrittene Benutzer und zur Fehlerbehebung kann der E-Mail-Inhalt direkt im HTML-Format angezeigt und bearbeitet werden.

Es gibt zwei Möglichkeiten, die HTML-Version der E-Mail zu bearbeiten:

  • Wählen Sie Bearbeiten > HTML aus, um die HTML-Version der gesamten E-Mail aufzurufen.

    email_designer_html1
  • Wählen Sie in der WYSIWYG-Benutzeroberfläche ein Element aus und danach das Symbol Quellcode.

    Nur der Quellcode des ausgewählten Elements wird angezeigt. Sie können den Quellcode bearbeiten, wenn das ausgewählte Element eine HTML-Inhaltskomponente ist. Andere Komponenten sind schreibgeschützt, können aber in der vollständigen HTML-Version der E-Mail bearbeitet werden.

    email_designer_html2

Wenn Sie den HTML-Code ändern, könnte es sein, dass Ihre E-Mails nicht mehr responsiv sind. Deshalb sollten Sie diese Funktion unbedingt unter Verwendung der Schaltfläche Vorschau testen. Siehe Vorschau von Nachrichten in Email Designer ansehen.

Inhaltserstellung durch Adobe-Campaign-Integrationen

Inhalt in Dreamweaver bearbeiten

Durch die Integration von Adobe Campaign Standard mit Dreamweaver kann E-Mail-Inhalt in der Benutzeroberfläche von Dreamweaver bearbeitet werden. Damit haben Sie Zugriff auf die leistungsstarken Optionen von Dreamweaver, um responsiven E-Mail-Content zu erstellen.

Diese Funktion wird im Detail im Dreamweaver-Handbuch beschrieben. Auch ein Video ist zur Veranschaulichung verfügbar.

Inhalt in Adobe Experience Manager bearbeiten

Inhalte können in Experience Manager bearbeitet und danach für mehrere E-Mail-Nachrichten in Adobe Campaign verwendet werden. In diesem Dokument erfahren Sie mehr dazu.

Dieses Werk unterliegt den Bedingungen der Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License.  Twitter™- und Facebook-Beiträge fallen nicht unter die Bedingungen der Creative Commons-Lizenz.

Rechtliche Hinweise   |   Online-Datenschutzrichtlinie