[Eingeschränkte Verfügbarkeit]{class="badge informative"}
Anwenden von Designs auf Ihren E-Mail-Inhalt apply-email-themes
Auf dieser Seite: Erfahren Sie, wie Sie im E-Mail-Designer Designs erstellen, anwenden und wiederverwenden können, um Ihren E-Mail-Inhalten und -Fragmenten markenkonforme Stile hinzuzufügen.
Mit Designs können technisch nicht versierte Benutzende wiederverwendbare Inhalte erstellen, die zu einer bestimmten Marke und Designsprache passen, indem sie zusätzlich zu den Standardvorlagen benutzerdefinierte Stile hinzufügen.
Diese Funktion ermöglicht es Marketing-Fachleuten, visuell ansprechende, markenkonsistente E-Mails schneller und mit weniger Aufwand zu nutzen und gleichzeitig erweiterte Anpassungsoptionen für individuelle Design-Anforderungen bereitzustellen.
Leitlinien und Einschränkungen themes-guardrails
-
Wenn Sie eine E-Mail von Grund auf neu erstellen, können Sie die Erstellung Ihres Inhalts mit einem Design beginnen, um schnell einen bestimmten Stil anzuwenden, der zu Ihrer Marke und Ihrem Design passt.
Wenn Sie den Modus „Manuelle Formatierung“ wählen, können Sie keine Designs anwenden, es sei denn, Sie setzen Ihre E-Mail zurück.
-
Fragmente sind zwischen dem Modus „Designs verwenden“ und dem Modus „Manuelle Formatierung“ nicht kreuzkompatibel.
-
Design-Fragmente sind nicht in E-Mail-Inhalten verfügbar, die ohne Designs erstellt wurden.
-
Damit Sie ein Fragment in einem Design-Inhalt nutzen können, muss das Fragment selbst mit Designs erstellt worden sein. Weitere Informationen
-
Wenn Sie ein Fragment im E-Mail-Inhalt verwenden, stellen Sie sicher, dass Sie ein Design anwenden, das Sie für dieses Fragment definiert haben. Anderenfalls kann es zu Anzeigeproblemen kommen, insbesondere in Outlook 2021 und früheren Versionen. Weitere Informationen
-
-
Wenn Sie einen in HTML erstellten Inhalt verwenden, befinden Sie sich im Kompatibilitätsmodus und können keine Designs auf diesen Inhalt anwenden.
-
Um Designs anzuwenden, müssen Sie zunächst den importierten Inhalt als neue Vorlage speichern und diese Vorlage dann in einen Design-kompatiblen Inhalt konvertieren. Anschließend können Sie diese Vorlage verwenden, um Ihren E-Mail-Inhalt zu erstellen. Informationen zum Konvertieren einer mit manueller Formatierung erstellten Vorlage finden Sie in diesem Abschnitt.
-
Sie können auch weiterhin Ihren importierten HTML-Inhalt konvertieren. Weitere Informationen
-
-
Wenn Sie benutzerdefinierte Web-Schriftarten (einschließlich Google-Schriftarten) in Ihren Themen verwenden, beachten Sie, dass viele E-Mail-Clients diese nicht unterstützen. Definieren Sie immer geeignete Ersatzschriftarten in Ihrem Thema, um die Lesbarkeit für alle E-Mail-Clients sicherzustellen.
- Gmail und Yahoo! laden keine externen Web-Schriftarten und greifen auf die Systemschriftarten zurück, unabhängig von der in Ihrem HTML/CSS angegebenen Schriftfamilie.
- Die einzigen von Gmail unterstützten Google-Schriftarten sind Roboto und Google Sans.
- Zu den E-Mail-Clients, die Web-Schriftarten unterstützen, gehören unter anderem Apple Mail, iOS Mail, Android Mail, Thunderbird und Outlook für macOS.
Erstellen eines Designs create-and-edit-themes
Gehen Sie wie folgt vor, um ein Design zu definieren, das Sie in künftigen E-Mail-Inhalten nutzen können.
-
Erstellen Sie zunächst eine neue Inhaltsvorlage.
-
Wählen Sie die Option Designs erstellen oder bearbeiten aus.
-
Wählen Sie ein Adobe-Design aus. Wählen Sie in diesem Beispiel das Standard-Design aus und klicken Sie auf Erstellen.
-
Sie können auch auf der Registerkarte Meine Designs eine benutzerdefinierte Vorlage auswählen und auf Bearbeiten klicken, um sie zu aktualisieren.
-
Beginnen Sie auf der Registerkarte Allgemeine Einstellungen mit der Definition Ihres Designs, indem Sie ihm einen bestimmten für Ihre Marke angemessenen Namen geben. Sie können die Standardbreite des Ansichtsfensters für Ihre E-Mails anpassen und auch das aktuelle Design exportieren, um es Sandbox-übergreifend freizugeben.
-
Verwenden Sie die Leiste auf der rechten Seite, um durch die verschiedenen Registerkarten zu navigieren und Ihre Designeinstellungen zu aktualisieren.
-
Führen Sie folgende Schritte auf der Registerkarte Farben aus:
-
Verwenden Sie die Schaltfläche Bearbeiten, um eine Farbpalette mit Standardfarben für Ihre Marke einzurichten. Wählen Sie eine Voreinstellung aus, um schnell ein Farbschema zu erstellen oder jede Farbe Ihres Designs individuell anzupassen. Sie können auch eine Kombination aus beidem verwenden.
-
Klicken Sie auf Variante hinzufügen, um mehrere Farbvarianten zu erstellen, z. B. den hellen und dunklen Modus, wobei jede Variante Ihres Designs über eine eigene Farbpalette und Steuerelemente für Nuancen verfügt.
-
Klicken Sie für jede Variante auf das Symbol Bearbeiten, um ein einzelnes Element zu bearbeiten. Sie können die von Ihnen erstellte Standardpalette oder beliebige benutzerdefinierte Farben verwenden.
-
-
In den Texteinstellungen können Sie die globale Schriftart festlegen, die Sie für Ihr gesamtes Design verwenden möchten. Für eine detailliertere Steuerung können Sie auch jede Überschrift und jeden Absatztyp bearbeiten, um die Schriftart, die Größe, den Stil usw. anzupassen.
note NOTE Beachten Sie bei der Auswahl benutzerdefinierter Web-Schriftarten, dass viele E-Mail-Clients wie Gmail und Yahoo! externe Web-Schriftarten nicht unterstützen, sondern auf Systemschriftarten zurückgreifen. Erwägen Sie die Verwendung von Ersatzschriftarten, um sicherzustellen, dass Ihr Inhalt in allen E-Mail-Clients korrekt angezeigt wird. Weitere Informationen -
Wählen Sie auf der Registerkarte Abstand ein einzelnes Element aus der Liste aus, um es mit dem richtigen Abstand zwischen den verschiedenen Komponenten einzufügen.
-
Mit den anderen Registerkarten auf der rechten Seite können Sie jedes Schaltflächenelement, jede Trennlinie, zusätzliche Bildformatierungen und den Abstand des Raster-Layouts für dieses Design separat verwalten.
-
Klicken Sie auf Speichern, um dieses Design für die zukünftige Verwendung zu speichern. Es wird jetzt auf der Registerkarte Meine Designs angezeigt.
Anwenden von Designs auf den E-Mail-Inhalt apply-themes-email
Gehen Sie wie folgt vor, um standardmäßige oder benutzerdefinierte Stil-Designs auf eine Inhaltsvorlage oder E-Mail anzuwenden.
-
In Journey Optimizer können Sie eine E-Mail-Aktion zu einer Journey oder Kampagne hinzufügen oder eine E-Mail-Inhaltsvorlage erstellen und den E-Mail-Text bearbeiten.
-
Sie können eine der folgenden Aktionen auswählen:
-
Wählen Sie eine integrierte E-Mail-Vorlage aus, um E-Mail-Designer zu öffnen. Es wird automatisch ein für jede Vorlage spezifisches Standard-Design angewendet.
-
Entwerfen Sie neuen Inhalt von Grund auf und wählen Sie Designs verwenden, um mit einem vordefinierten Stil-Design zu beginnen.
note caution CAUTION Wenn Sie den Modus „Manuelle Formatierung“ wählen, können Sie keine Designs anwenden, es sei denn, Sie setzen Ihr Design zurück. Damit Sie ein Fragment in einem Design-Inhalt nutzen können, muss das Fragment selbst mit Designs erstellt worden sein. Weitere Informationen
-
-
Klicken Sie im E-Mail-Designer in der rechten Leiste auf die Schaltfläche Designs. Es wird das Standard-Design oder das Design der Vorlage angezeigt. Sie können zwischen den beiden Farbvarianten für dieses Design wechseln.
-
Klicken Sie auf den Pfeil neben dem aktuell verwendeten Design. Die Liste der verfügbaren benutzerdefinierten und Adobe-Designs wird angezeigt.
-
Klicken Sie auf Meine Designs und wählen Sie das von Ihnen erstellte Design aus.
-
Klicken Sie auf einen Bereich außerhalb der Dropdown-Liste. Das neu ausgewählte benutzerdefinierte Design wendet seine Stile automatisch auf alle E-Mail-Komponenten an. Sie können zwischen den Farbvarianten wechseln, falls vorhanden.
-
Wenn ein Design in einer Inhaltsvorlage ausgewählt ist, können Sie auf die Schaltfläche Design bearbeiten klicken, um es zu aktualisieren. Weitere Informationen
{width="40%"}
note NOTE Diese Option ist nicht verfügbar, wenn Designs im E-Mail-Inhalt verwendet werden. -
Wenn Sie ein Design mit mehreren Farbvarianten verwenden, können Sie eine bestimmte Variante für eine bestimmte Strukturkomponente auswählen. Auf diese Weise können Sie eine Farbvariante für den gesamten Inhalt definieren und eine andere Variante nur für eine bestimmte Struktur verwenden.
note NOTE Diese Aktion kann nicht für Inhaltskomponenten ausgeführt werden. Wählen Sie hierzu eine Strukturkomponente aus, klicken Sie auf der Registerkarte Stile rechts auf die Option ]Variante eines bestimmten Designs verwenden[!UICONTROL und wenden Sie die gewünschte Variante auf diese Struktur an.
In diesem Beispiel wird die erste Farbvariante des aktuellen Designs auf den gesamten E-Mail-Inhalt angewendet, aber die dritte Farbvariante wird auf die ausgewählte Struktur angewendet. Sie können sehen, dass sich die Hintergrundfarben des Textkörpers und des Ansichtsfensters für diese spezifische Struktur vom Rest des Inhalts unterscheiden.
Sie können jederzeit zwischen Designs wechseln. Der E-Mail-Inhalt bleibt unverändert, aber die Stile werden aktualisiert, um das neue Design widerzuspiegeln.
Entsperren von Stilen unlocking-styles
Wenn eine Komponente ausgewählt wird, können Sie ihren Stil über das entsprechende Symbol in der Registerkarte Stile entsperren.
Das ausgewählte Design wird weiterhin auf diese Komponente angewendet, Sie können jedoch die Stilelemente überschreiben. Wenn Sie Designs wechseln, wird das neue Design nur auf die Stilelemente angewendet, die nicht überschrieben wurden.
Wenn Sie beispielsweise eine Textkomponente entsperren, können Sie die Schriftfarbe von Schwarz in Rot ändern:
Wenn Sie das Design ändern, ist die Schriftfarbe für diese Komponente weiterhin Rot, aber die Hintergrundfarbe für diese Komponente ändert sich entsprechend des neuen Designs:
Verwenden von Designs in einem Fragment leverage-themes-fragment
Damit Sie ein Fragment in einer Vorlage oder E-Mail mit angewendeten Designs nutzen können, muss dieses Fragment selbst mit Designs erstellt worden sein. Anderenfalls können Sie dieses Fragment nicht in Ihrem Design-Inhalt verwenden.
Gehen Sie wie folgt vor, um ein mit Designs kompatibles Fragment zu erstellen:
-
Erstellen Sie in Journey Optimizer ein visuelles Fragment und klicken Sie auf Erstellen, um den Inhalt Ihres Fragments zu gestalten. Weitere Informationen
-
Wählen Sie Designs verwenden aus, um mit einem vordefinierten Stil-Design zu beginnen.
{width="100%"}
note caution CAUTION Wenn Sie den Modus „Manuelle Formatierung“ wählen, können Sie keine Designs anwenden, es sei denn, Sie setzen Ihr Fragment-Design zurück. -
Sobald Sie den E-Mail-Designer geöffnet haben, können Sie mit der Erstellung Ihres Fragments beginnen.
-
Klicken Sie in der rechten Leiste auf die Schaltfläche Designs. Das Standard-Design wird angezeigt. Sie können zwischen den verschiedenen Farbvarianten für dieses Design wechseln.
{align="center" width="100%" modal="regular"}
-
Sie können andere Designs auswählen, um eine Vorschau Ihres Fragmentinhalts anzuzeigen. Wählen Sie dazu den Pfeil neben dem Standard-Design aus und klicken Sie auf Designs auswählen.
{width="40%"}
-
Sie können zwischen den Registerkarten Adobe und Meine Designs navigieren und bis zu fünf kompatible Designs (aus beiden Registerkarten) für Ihr Fragment auswählen.
note NOTE Dieses Limit wird aus Kompatibilitäts- und Leistungsgründen durchgesetzt. Das Adobe-Standard-Design kann nicht entfernt werden. Sie können daher bis zu vier zusätzliche benutzerdefinierte Designs auswählen. {width="70%"}
note caution CAUTION Wenn Sie dieses Fragment in einem E-Mail-Inhalt verwenden, muss das E-Mail-Design eines der mit dem Fragment verknüpften Designs sein. Wenn das Design nicht übereinstimmt, wird das Einfügen des Fragments blockiert. -
Klicken Sie auf Schließen.
-
Wählen Sie erneut den Pfeil neben dem Standard-Design aus. Sie können nun zwischen den verschiedenen ausgewählten Designs wechseln, um in der Vorschau anzuzeigen, wie jeder Stil gerendert wird.
{width="90%"}
-
Klicken Sie erneut auf Designs auswählen, um weitere Designs hinzuzufügen oder Ihre Auswahl zu ändern.
Erstellen einer mit Designs kompatiblen Vorlage theme-convertor
Mit Journey Optimizer können Sie eine Vorlage, die mit manuellen Formatierungen erstellt wurde, in einen Inhalt umwandeln, der mit Designs kompatibel ist. Dies kann besonders dann nützlich sein, wenn Sie Inhaltsvorlagen erstellt haben, bevor Designs in Journey Optimizer eingeführt wurden, oder wenn Sie externe Inhalte importieren.
-
Öffnen Sie die Inhaltsvorlage einer E-Mail und bearbeiten Sie den Inhalt mit dem E-Mail-Designer.
-
Wählen Sie das Symbol Designs in der rechten Leiste aus und klicken Sie auf die Schaltfläche Design aus Inhalten generieren.
{width="100%"}
-
Das Fenster Design erstellen wird geöffnet. Journey Optimizer erkennt die Stilelemente automatisch und konsolidiert sie in einem neuen Design.
{width="90%"}
-
Geben Sie einen Namen für Ihr Design ein.
-
Nehmen Sie Ihre eigenen Anpassungen vor, als würden Sie ein Thema von Grund auf neu erstellen, indem Sie z. B. eine Farbvariante hinzufügen, Schriftarten bearbeiten usw. Weitere Informationen
{width="90%"}
-
Klicken Sie auf Speichern, um dieses neue Design für die Wiederverwendung zu speichern. Sie können dieses Design nun wie jedes andere Design auf Ihre Inhalte anwenden. Weitere Informationen
This section contains structured knowledge intended to support interpretation, retrieval, and question answering related to this topic.
For complete understanding, this information should be combined with the documentation on this page. Neither source is intended to stand alone; the page describes the feature, while this section provides additional context that helps disambiguate terminology, intent, applicability, and constraints.
- TL;DR: This page explains how to create, apply, and reuse themes in the Email Designer to add brand-consistent styling on top of email content and fragments, including converting manual-styling templates into theme-compatible content.
Intents:
- Create a theme with a color palette, variants, text settings, spacing, buttons, dividers, and grid layout
- Apply a default or custom theme to an email or content template
- Switch themes and apply a specific color variant to an individual structure component
- Unlock a component’s style to override individual styling elements
- Create fragments compatible with themes and associate up to five themes with a fragment
- Convert a manual-styling email template into theme-compatible content using Generate theme from content
Glossary:
- Theme: Reusable custom styling added on top of standard templates to fit a specific brand and design language (product-specific)
- Use Themes mode: The mode selected when creating content from scratch to start with a predefined styling theme (product-specific)
- Manual Styling mode: The alternative mode; if chosen, themes cannot be applied unless you reset your email/design/fragment (product-specific)
- Compatibility mode: The mode you are in when using content created in HTML, where themes cannot be applied directly (product-specific)
- Color variant: A distinct color palette and nuance control set within a theme, such as light and dark mode (product-specific)
- Generate theme from content: A Themes action that automatically detects styling elements in a template and consolidates them into a new theme (product-specific)
Guardrails:
- This capability is in Limited Availability; contact your Adobe representative to gain access.
- If you choose Manual Styling mode, you cannot apply themes unless you reset your email, design, or fragment.
- Fragments are not cross-compatible between the Use Themes and Manual Styling modes; a fragment used in themed content must itself have been created using themes.
- When using a fragment in email content, the email theme must be one of the themes associated with the fragment; if the theme does not match, the fragment insertion is blocked.
- A fragment can have up to five compatible themes selected (from both the Adobe themes and My themes tabs); this limit is enforced for compatibility and performance reasons. The Adobe default theme cannot be removed, so you can select up to four additional custom themes.
- Content created in HTML is in compatibility mode; to apply themes you must first save it as a new template, then convert the template into theme-compatible content.
- Only email templates can be converted to be theme-compatible; individual emails cannot be converted—you must save content as a template first.
- Gmail and Yahoo! do not load external web fonts and fall back to system fonts; the only Google fonts supported by Gmail are Roboto and Google Sans. Always define fallback fonts.
- Mismatched fragment themes may cause display issues, especially in Outlook 2021 and previous versions.
- The Edit theme button (available in a content template) is not available when using themes in email contents; the specific-variant option cannot be applied to content components (only structure components).
Terminology:
- Canonical name: Theme — Acronym: n/a — variants: email theme, Adobe theme, custom theme
- Synonyms: “Use Themes mode” = “Use Themes”
- Do not confuse: “Use Themes mode” (themes can be applied) ≠ “Manual Styling mode” (themes cannot be applied unless reset)
- Do not confuse: “Adobe themes” (built-in themes) ≠ “My themes” (themes you created)
FAQ:
- Q: Is the themes capability generally available? — No, it is in Limited Availability; contact your Adobe representative to gain access.
- Q: Can I use any fragment in themed content? — Only if the fragment was itself created using themes and the email theme matches one of the themes associated with the fragment; otherwise fragment insertion is blocked.
- Q: How many themes can I associate with a fragment? — Up to five compatible themes across the Adobe themes and My themes tabs; the Adobe default theme cannot be removed, leaving up to four additional custom themes.
- Q: Can I convert an existing manually styled asset to use themes? — Only email templates can be converted (via Generate theme from content); individual emails cannot, so save your content as a template first.
- Q: What happens to my content when I switch themes? — The email content remains unchanged, but the styles update to reflect the new theme; overridden (unlocked) styling elements are not changed by the new theme.
- Q: Why might web fonts not render? — Gmail and Yahoo! do not load external web fonts and fall back to system fonts; only Roboto and Google Sans are supported by Gmail, so define fallback fonts.