Mit dem Drag & Drop-Editor wird die Erstellung von professionellen E-Mails zum Kinderspiel. Er bietet mehr Optionen, um Ihre E-Mail zu personalisieren, und stellt sicher, dass die Nachricht auf allen E-Mail-Clients und Geräten korrekt angezeigt wird.

In diesem Artikel erklären wir Ihnen, wie Sie die Inhaltsblöcke in Ihren E-Mails verwenden und wie Sie deren Einstellungen ändern.

Wir haben die Artikel zum Drag & Drop-Editor in mehrere Teile aufgeteilt:

• Teil 1: Übersicht über den Editor
• Teil 2: Stil- vs. Inhaltsblöcke
• Teil 3: Inhaltsblöcke verwenden – SIE SIND HIER
• Teil 4: Design-Stil Ihrer E-Mail festlegen
• Teil 5: Blöcke speichern und in Ihren Kampagnen wiederverwenden
• Teil 6: E-Mails in der mobilen Ansicht bearbeiten
• Teil 7: Das Kampagnen-Design wiederherstellen, eine Vorschau anzeigen, testen und speichern

Erste Schritte

Richten Sie Ihre Markenbibliothek so ein, dass jedes neue Template, das Sie auswählen, die Eigenschaften Ihrer Marke übernimmt, beispielsweise das Logo, die Farben, die Schriftarten und Social-Media-Links. --Mit der Markenbibliothek sparen Sie nicht nur Zeit, sondern sorgen auch für ein einheitliches E-Mail Branding. Weitere Informationen finden Sie im entsprechenden Artikel Ihre E-Mails mithilfe der Markenbibliothek automatisch mit Ihren Marken-Assets gestalten.

Titel und Text

Symbolleiste zur Textformatierung

Wählen Sie im Designer den Inhaltsblock Text oder Titel aus, um die Symbolleiste zur Textformatierung oben im Block mit den folgenden Optionen anzuzeigen:

Farben Personalisierung hinzufügen Links einfügen

Die Farben, die Sie in Ihrem Template verwenden, werden jetzt in der Farbauswahl gespeichert. Sie können eine gespeicherte Farbe jederzeit entfernen, indem Sie einen Text mit dieser Farbe auswählen, auf die Farbauswahl klicken und dann Remove color (Farbe entfernen) auswählen. Es kann einige Minuten dauern, bis sie nicht mehr angezeigt wird.

Klicken Sie auf 👤, um eine Personalisierung in Ihren Text einzufügen, beispielsweise den Vornamen Ihrer Empfänger:innen.
Weitere Informationen finden Sie im Artikel zur Personalisierung von Text mithilfe von Kontaktattributen.

Um einen Link in Ihren Text einzufügen, wählen Sie den Text aus, klicken Sie auf das Link-Symbol oder drücken Sie ⌘ oder Strg + K und geben Sie die Details im Fenster Insert/edit link (Link einfügen/bearbeiten) ein. Der Titel des Links wird in einem Popup angezeigt, wenn Sie den Mauszeiger über den Link bewegen.

Sie können verschiedene Arten von Links auswählen:

• Absolute link (URL) (Absoluter Link (URL))
  Dies ist die grundlegende Option für Links. Wählen Sie diese aus, um eine URL hinzuzufügen.
• View in browser (Im Browser anzeigen)
  Der Mirror Link kann der Kopfzeile Ihrer Kampagnen hinzugefügt werden. Es handelt sich um einen Link, auf den Empfänger:innen klicken können, wenn sie Probleme beim Anzeigen Ihrer E-Mail in ihrem Postfach haben und eine Webversion Ihrer E-Mail öffnen möchten. Ein Mirror-Link in Ihren Kampagnen ist nicht zwingend erforderlich.
  ➡️ Weitere Informationen finden Sie in unserem entsprechenden Artikel über Mirror-Links.
• Unsubscribe (Abbestellen)
  Der Abmeldelink wird automatisch der Fußzeile Ihrer Kampagnen hinzugefügt. Dabei handelt es sich um einen Link, auf den die Empfänger:innen klicken können, um Ihre Brevo-Abmeldeseite zu öffnen und sich von Ihren E-Mails abzumelden. Das Vorhandensein eines Abmeldelinks in Ihren Kampagnen ist obligatorisch, da er für Ihre Kontakte und für das ordnungsgemäße Funktionieren Ihrer Kampagnen unerlässlich ist.
  ➡️ Weitere Informationen finden Sie in unserem diesbezüglichen Artikel über Abmeldelinks.
  
• Update your preferences (Ihre Präferenzen aktualisieren)
  Brevo bietet ein Profilaktualisierungsformular, um Ihnen zu helfen, aktualisierte Informationen über Ihre Abonnenten zu sammeln, beispielsweise ihre Details, ihre Präferenzen und sogar die Listen, die sie abonnieren möchten. Wir empfehlen, in der Fußzeile aller E-Mails einen Link zu diesem Formular zu integrieren, damit Ihre Abonnenten Ihnen ihre Präferenzen mitteilen können. 
  ➡️ Weitere Informationen finden Sie in unserem diesbezüglichen Artikel über Links zur Profilaktualisierung.
  
  💡 Gut zu wissen

  Diese Option wird automatisch hinzugefügt, wenn Sie ein Formular unter Campaign (Kampagne) > Advanced settings (Erweiterte Einstellungen) > Use a custom update profile form (Angepasstes Profilaktualisierungsformular verwenden) auswählen, wie hier erläutert.
  Wenn die Option ausgegraut ist, müssen Sie sie unter Campaigns (Kampagnen) > Advanced settings (Erweiterte Einstellungen) aktivieren. Wenn Sie ein Template verwenden, müssen Sie den Link manuell zum Formular Update your preferences (Präferenzen aktualisieren) hinzufügen.
• Email Link (mailto) (E-Mail-Link (mailto))
  Fügen Sie einen Link zu einer E-Mail-Adresse hinzu.
• Click to call phone number (Klicken zum Anrufen einer Telefonnummer)
  Fügen Sie einen Link zu einer Telefonnummer hinzu.
• Anchor for relative links (Anker für relative Links)
  Erstellen Sie an einer beliebigen Stelle Ihrer Kampagne einen Anker und verwenden Sie dann die Option für relative Links, um eine Verknüpfung mit diesem Anker herzustellen. 
• Relative link (for anchors) (Relativer Link (für Anker)
  Sobald Sie einen Anker in Ihrer Kampagne erstellt haben, verwenden Sie diese Option, um eine Verknüpfung mit dem Anker herzustellen.
  Beispielsweise, um zu einem bestimmten Teil des Newsletters weiter oben auf der Seite zurückzugehen.

Um einen Link zu entfernen oder zu aktualisieren, platzieren Sie den Cursor auf dem Link und klicken Sie auf das Link-Symbol, um die Schaltflächen Remove (Entfernen) und Update (Aktualisieren) anzuzeigen.

Sehen Sie sich das Video an, um mehr über das Hinzufügen eines Links, einer Hintergrundfarbe oder eines Bildes und das Ändern von Textblockeinstellungen zu erfahren:

Einstellungen im linken Menü

Gleicher Block, andere Formatierung

Klicken Sie auf den Textblock, um auf der linken Seite ein Menü mit zusätzlichen Einstellungen anzuzeigen, die denen ähneln, die auf der Registerkarte Design verfügbar sind. 
Weitere Informationen zur Verwendung dieser Einstellungen finden Sie unter Design-Stil Ihrer E-Mail festlegen.

Mit diesem Editor können Sie innerhalb desselben Textblocks unterschiedliche Formatierungen auswählen. Sie können beispielsweise einen Titel gefolgt von einem Absatz und Aufzählungszeichen verwenden. Sie können auch verschiedene Farben innerhalb desselben Blocks verwenden. 

Ränder

Sie können Ihrem Textblock sowie Ihren Bildern auch Ränder hinzufügen, indem Sie die Einstellung Borders (Ränder) im linken Menü verwenden. Sie können für jeden Rand eine andere Größe und Farbe festlegen oder die Schaltfläche Apply on all sides (Auf alle Seiten anwenden) aktivieren, um eine einzige Größe und Farbe für alle Ränder anzuwenden. 

Bild

Sie können ein Bild über die Registerkarte Content (Inhalt) hinzufügen, indem Sie den Bildblock verwenden. Sie können das Bild Ihrer Wahl per Drag & Drop aus Ihrem System oder Ihrer Inhaltsbibliothek hinzufügen oder den Link zu Ihrem Bild in das Feld Insert image from URL (Bild von URL einfügen) einfügen. Sie können Ihr Bild direkt im Editor skalieren oder bearbeiten.

Das linke Menü enthält zusätzliche Einstellungen, die denen ähneln, die auf der Registerkarte Design verfügbar sind. 
Weitere Informationen zur Verwendung dieser Einstellungen finden Sie unter Design-Stil Ihrer E-Mail festlegen.

Ein Bild hinzufügen

Ein Bild skalieren

Um ein Bild zu skalieren, klicken Sie darauf, um es auszuwählen, und platzieren Sie Ihren Cursor in der unteren rechten Ecke des Bildes. Sobald der Doppelpfeil angezeigt wird, ziehen Sie an der Ecke, bis Sie die perfekte Größe gefunden haben. Die Größe Ihres Bildes wird in der unteren rechten Ecke des Bildes blau angezeigt und während der Skalierung automatisch aktualisiert.
Sie können auch das Feld Width (Breite) im linken Menü verwenden, um die Größe Ihres Bildes zu skalieren.

Ein Bild bearbeiten

Unser Drag & Drop-Editor umfasst einen Fotoeditor, mit dem Sie Ihr Bild zuschneiden, Filter, Text oder Textdesign hinzufügen können. Um auf den Fotoeditor zuzugreifen, klicken Sie auf Ihr Bild und dann in den Image Settings (Bildeinstellungen) auf die Schaltfläche Edit (Bearbeiten).

Sie können auch:

• Ein Foto aus der Inhaltsbibliothek bearbeiten
• Dank der Funktion Create image (Bild erstellen) können Sie auch Ihr eigenes Bild entwerfen und es in der Inhaltsbibliothek speichern. Weitere Informationen finden Sie im entsprechenden Artikel Entwerfen Sie einen professionellen Newsletter mit unserer Funktion Bild erstellen.

Einen Link zu einem Bild hinzufügen

Durch das Hinzufügen eines Links zu einem Bild können Sie Ihre Empfänger:innen umleiten. Sie können sie auf eine Seite oder zu einer Datei umleiten.

Schaltfläche

Fügen Sie Schaltflächen hinzu, um einen Call-to-action in Ihren E-Mails zu erstellen:

1. Ziehen Sie den Schaltflächenblock per Drag & Drop in Ihre Kampagne.
2. Ersetzen Sie den Call-to-action-Text durch einen Text, der dem Inhalt entspricht, zu dem Sie Ihre Empfänger:innen weiterleiten möchten. 
   Sie können den Text mit Kontakt-Attributen personalisieren. 
3. Optional: Verwenden Sie die Menüleiste zur Textformatierung und die Schaltflächeneinstellungen im linken Menü, um Ihre Schaltfläche zu personalisieren. 
4. Fügen Sie einen Link hinzu, um Ihre Empfänger:innen umzuleiten.
   Auf eine Seite umleiten Zu einer Datei umleiten

   So leiten Sie Ihre Empfänger:innen auf die Seite Ihrer Wahl um:

   1. Wählen Sie die Schaltfläche aus und klicken Sie auf Add link (Link hinzufügen).
   2. Wählen Sie die Art des Links aus, den Sie einfügen möchten, und geben Sie die entsprechende URL in das Feld Link target (Ziel des Links) ein.
   3. Optional: Fügen Sie einen Linktitel hinzu, der als Tooltip angezeigt wird, wenn Sie den Mauszeiger darüber bewegen.
   4. Klicken Sie auf Insert (Einfügen).
      

   So leiten Sie Ihre Empfänger:innen zu einer Datei um, die sie herunterladen sollen:

   1. Laden Sie Ihre Datei bei einem Drittanbieter wie WeTransfer oder Dropbox hoch und stellen Sie sicher, dass Ihre Datei öffentlich zugänglich ist.
   2. Wählen Sie das Bild aus und klicken Sie auf  Add link (Link hinzufügen).
   3. Wählen Sie im Feld Type of link (Art des Links) die Option Absolute link (URL) (Absoluter Link (URL)) aus.
   4. Geben Sie die URL Ihrer Datei im Feld Link target (Ziel des Links) ein.
   5. Optional: Fügen Sie einen Linktitel hinzu, der als Tooltip angezeigt wird, wenn Sie den Mauszeiger darüber bewegen.
   6. Klicken Sie auf Insert (Einfügen).
      

Sehen Sie sich das Video an, um mehr über das Ändern von Einstellungen wie Breite, Randradius, Linienstärke und Hintergrundfarbe für den Schaltflächenblock zu erfahren.

Logo

Mit diesem Inhaltsblock können Sie Ihr Markenlogo an einer beliebigen Stelle in Ihr E-Mail-Design einfügen. Fügen Sie Ihr Logo zu Ihrer Markenbibliothek hinzu, damit Sie es nicht jedes Mal neu hochladen müssen. 

Social

Mit dem Social-Block können Sie die Empfänger:innen auf Ihre Social-Media-Seiten umleiten, wenn sie auf die Symbole klicken.

1. Ziehen Sie Ihren Social-Block aus der Registerkarte Content (Inhalt) in Ihre Kampagne.
2. Behalten Sie die standardmäßigen Designeinstellungen für Symbole bei oder wählen Sie die Größe, den Stil, das Thema und den Abstand für Ihre Social-Media-Symbole aus.
3. Fügen Sie den Link zu Ihren Social-Media-Seiten in das entsprechende Feld der Symboleinstellungen ein.
   Sie können bei Bedarf auf Add more (Mehr hinzufügen) klicken, um Social-Media-Symbole und Links hinzuzufügen, oder auf das Papierkorbsymbol klicken, um ein Social-Media-Symbol und einen Link aus dem Block zu löschen. 

Sehen Sie sich das Video an, um mehr über das Ändern der Einstellungen für den Social-Block zu erfahren.

HTML

Mithilfe des HTML-Blocks können Sie eigenen Code hinzufügen. Sie können entweder Code eingeben oder kopieren und einfügen. Um eine Vorschau des Codes anzuzeigen, verlassen Sie einfach den HTML-Block.

Einige E-Mail-Clients unterstützen nicht alle HTML-Inhalte, da E-Mail-HTML nicht als Web-HTML entwickelt wird. Um Probleme mit Ihrem Code im HTML-Editor und -Block zu vermeiden, lesen Sie unseren diesbezüglichen Artikel zur Verwendung von HTML in E-Mail-Kampagnen.

Stil 

Die Stil-Inhaltsblöcke sind vordefinierte Inhaltsblöcke, die Sie mit anderen Inhaltsblöcken ausfüllen können. Sie können zwischen drei verschiedenen Stil-Inhaltsblöcken auswählen. Weitere Informationen finden Sie im entsprechenden Artikel Stil- vs. Inhaltsblöcke.

Trennlinie

Der Trennlinien-Block fügt eine horizontale Linie hinzu, um Blöcke zu trennen.

Sehen Sie sich das Video an, um mehr über das Ändern von Einstellungen wie Dicke, Farbe, Form, Breite, Hintergrundfarbe für den Trennlinien-Block zu erfahren.

Kopf-und Fußzeile

Verwenden Sie den Kopfzeilen-Block, um Ihr Unternehmenslogo hinzuzufügen.

Der Fußzeilen-Block ist wichtig, da er Ihren Empfängern mehr Informationen über Ihr Unternehmen bietet und es ihnen ermöglicht, sich abzumelden oder ihre Präferenzen zu ändern. Er kann Folgendes enthalten:

Produkt

Ziehen Sie den Produkt-Inhaltsblock per Drag & Drop in Ihren Newsletter. Sie sehen das Produktbild, den Produkttitel, die Produktbeschreibung und den Produktpreis. Das Produktbild und die Schaltfläche sind automatisch mit der Produkt-URL verlinkt, solange Ihr Shop veröffentlicht ist.

Abstandshalter 

Mit dem Abstandshalter-Inhaltsblock können Sie einen Leerraumblock in Ihr E-Mail-Design einfügen. Sie können die Breite oder Höhe Ihres Abstandshalter-Inhaltsblocks bearbeiten, um einen mehr oder weniger großen Leerraum zu erhalten. Die maximale Breite beträgt 100 % und die minimale Höhe beträgt 30 Pixel. Sie können auch die Farbe Ihres Abstandsblocks ändern, um einen Farbblock zu erstellen.

Video 

Mit unserem Video-Inhaltsblock können Sie ganz einfach einen Videolink in Ihre E-Mail-Kampagnen einfügen:

Weitere Informationen finden Sie im entsprechenden Artikel zum Thema Videos in E-Mail-Kampagnen einfügen.

⏩ Nächste Schritte

• Teil 4: Design-Stil Ihrer E-Mail festlegen
• Teil 5: Blöcke speichern und in Ihren Kampagnen wiederverwenden
• Teil 6: E-Mails in der mobilen Ansicht bearbeiten
• Teil 7: Vorschau anzeigen und Test-E-Mail senden

🤔 Sie haben eine Frage?

Wenden Sie sich bei Fragen an unser Support-Team: Erstellen Sie einfach ein Ticket über Ihr Konto. Wenn Sie noch kein Konto haben, können Sie uns hier kontaktieren.