Mit dem Drag & Drop Editor [Neues Design] 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 Endgeräten einwandfrei angezeigt wird.

In diesem Artikel erklären wir Ihnen, wie Sie Content-Blöcke in Ihren E-Mails verwenden und ihre Einstellungen ändern.

Wir haben die Artikel zum Drag & Drop Editor [Neues Design] in mehrere Teile aufgeteilt.

• Teil 1: Übersicht über den Editor
• Teil 2: Layouts vs. Content-Blöcke
• Teil 3: Content-Blöcke verwenden - SIE SIND HIER
• Teil 4: Festlegen des Design-Stils Ihrer E-Mail
• 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

Gut zu wissen

Sie können Ihre Marken-Bibliothek so einrichten, dass jedes neue Template, das Sie auswählen,die Merkmale Ihrer Marke übernimmt, wie beispielsweise Logo, Farben, Fonts und Social-Media-Links. Mit der Marken-Bibliothek sparen Sie nicht nur Zeit, sondern sorgen auch für ein einheitliches E-Mail-Branding. Weitere Informationen dazu finden Sie in dem Artikel Ihre E-Mails mithilfe der Marken-Bibliothek automatisch mit Ihren Brand Assets gestalten.

Titel und Text

Menüleiste Textformatierung

Wählen Sie den Content-Block Text oder Titel aus dem Designer, um die Menüleiste Textformatierung mit den folgenden Optionen oben im Block anzuzeigen:

Farben Formatierung Links einfügen  Personalisierung

Die Farben, die Sie in Ihrem Template verwenden, werden nun in der Farbauswahl gespeichert. Sie können eine gespeicherte Farbe jederzeit entfernen, indem Sie einen Text mit dieser Farbe auswählen, die Farbauswahl anklicken und dann auf Farbe entfernen klicken. Es kann einige Minuten dauern, bis sie verschwindet.

💡 Gut zu wissen

Wir haben Ihre Unternehmensfarben zu Ihren Templates hinzugefügt!
Wir verwenden die Brandfetch-API, um alle verfügbaren Informationen zu Ihrer Marke zu erhalten und Logo, Farben & Social Media (sofern verfügbar) automatisch abzurufen, um alle 4 grundlegenden Layout-Templates anzupassen.

Sie können die Formatierung eines ausgewählten Textes entfernen, indem Sie auf das Symbol Formatierung entfernen klicken:

Um einen Link in Ihren Text einzufügen, wählen Sie den Text aus, klicken Sie auf das Link-Symbol und geben Sie die Details in das Fenster Link einfügen/bearbeiten ein. Der Link-Titel ist das Pop-up, das angezeigt wird, wenn Sie mit der Maus über Ihren Link fahren.

Sie können verschiedene Link-Typen auswählen:

• Absolute Link (URL)
  Dies ist die grundlegende Option für Links. Wählen Sie sie, um eine URL hinzuzufügen.
• Im Browser anzeigen
  Der Mirror Link kann in die zum Kopfzeile Ihrer Kampagne hinzugefügt. Die Empfänger können ihn anklicken, wenn sie Probleme beim Anzeigen der E-Mail in ihrem Posteingang haben und Ihre E-Mail als Website öffnen möchten. Ein Mirror Link ist in Ihren Kampagnen nicht obligatorisch.
  ➡️ Weitere Informationen finden Sie in unserem dedizierten Artikel zu Mirror Links.
• Abmelden
  Der Abmeldelink wird automatisch zum Footer Ihrer Kampagnen hinzugefügt. Ihre Empfänger können ihn anklicken, um Ihre Sendinblue-Abmeldeseite zu öffnen und Ihre E-Mails abzubestellen. Ein Abmeldelink ist in Ihren Kampagnen zwingend erforderlich, da er für Ihre Kontakte und den reibungslosen Ablauf Ihrer Kampagne essenziell ist.
  ➡️ Weitere Informationen finden Sie in unserem dedizierten Artikel zu Abmeldelinks.
  
• Ihre Präferenzen aktualisieren
  Sendinblue bietet Ihnen ein spezielles Profilaktualisierungsformular, um aktualisierte Informationen über Ihre Abonnenten zu sammeln, wie beispielsweise ihre Details, Präferenzen und sogar, welche Listen sie abonnieren möchten. Wir empfehlen, einen Link zu diesem Formular in den Footer aller E-Mails zu integrieren, damit Ihre Abonnenten Ihnen ihre Präferenzen leichter mitteilen können.
  ➡️ Weitere Informationen finden Sie in unserem dedizierten Artikel zu Profilaktualisierungslinks.
  
  💡 Gut zu wissen

  Diese Option wird automatisch hinzugefügt, wenn Sie ein Formular in Kampagne > Erweiterte Einstellungen > Ein benutzerdefiniertes Profilaktualisierungsformular verwenden wählen, wie hier erklärt.
  Wenn diese Option ausgegraut ist, müssen Sie sie in Kampagnen > Erweiterte Einstellungen aktivieren. Wenn Sie ein Template verwenden, müssen Sie den Link manuell zum Formular zur Aktualisierung der Präferenzen hinzufügen.
  
• E-Mail-Link (mailto)
  Fügen Sie einen Link zu einer E-Mail-Adresse ein.
• Für Anruf klicken
  Fügen Sie einen Link zu einer Telefonnummer hinzu.
• Anker für relative Links
  Erstellen Sie an einer beliebigen Stelle in Ihrer Kampagne einen Anker und verwenden Sie dann die Option "Relativer Link", um diesen Anker zu verlinken. 
• Relativer Link (für Anker)
  Verwenden Sie diese Option, nachdem Sie den Anker in Ihrer Kampagne erstellt haben, um den Anker zu verlinken.
  Zum Beispiel, um zu einem spezifischen Teil des Newsletters weiter oben auf der Seite zurückzugehen.

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

Klicken Sie auf 👤, um eine Personalisierung zu Ihrem Text hinzuzufügen, zum Beispiel den Vornamen Ihrer Empfänger.
Erfahren Sie außerdem, wie Sie Ihren Text mit Kontaktattributen personalisieren können.

Sehen Sie sich dieses Video an, um mehr darüber zu erfahren, wie Sie einen Link, eine Hintergrundfarbe oder ein Bild hinzufügen und die Textblock-Einstellungen ändern können:

Einstellungen im linken Menü

Gleicher Block, andere Formatierung

Klicken Sie auf die Schaltfläche Text-Block, um die linke Menüleiste mit zusätzlichen Einstellungen anzuzeigen, die jenen in der Registerkarte Design ähneln. 
Lesen Sie für weitere Informationen zur Verwendung dieser Einstellungen den Artikel Den Design-Stil für Ihre gesamte E-Mail festlegen.

Mit diesem neuen Editor können Sie unterschiedliche Formatierungen im selben Textblock wählen. Sie können beispielsweise einen Titel verwenden, gefolgt von einem Paragrafen und Aufzählungspunkten. Sie können außerdem verschiedene Farben im selben Block verwenden. 

Ränder

Mithilfe der Einstellung Ränder im linken Menü können Sie zudem Ränder zu Ihrem Text-Block und Ihren Bildern hinzufügen. Legen Sie für jeden Rand verschiedene Größen und Farben fest oder schalten Sie die Schaltfläche Auf alle Seiten anwenden um, um eine einzige Größe und Farbe für alle Ränder anzuwenden. 

Bild

Mit dem Bildblock können Sie ein Bild aus der Registerkarte Inhalt hinzufügen. Sie können das gewünschte Bild hinzufügen, indem Sie auf Ersetzen klicken oder den Link zu Ihrem Bild in das Feld Bild aus URL einfügen einfügen. Sie können Ihr Bild direkt im Editor skalieren oder bearbeiten. 

Weitere Informationen finden Sie in unserem speziellen Artikel Bilder in Ihrer Content-Bibliothek in Ordnern organisieren.

Im linken Menü sind ähnliche Einstellungen verfügbar wie in der Registerkarte Design. 
Lesen Sie für weitere Informationen zur Verwendung dieser Einstellungen den Artikel Den Design-Stil für Ihre gesamte E-Mail festlegen.

Mithilfe der Einstellung Ränder im linken Menü können Sie zudem Ränder zu Ihrem Textblock und Ihren Bildern hinzufügen. Legen Sie für jeden Rand verschiedene Größen und Farben fest oder schalten Sie die Schaltfläche Auf alle Seiten anwenden um, um eine einzige Größe und Farbe für alle Ränder anzuwenden.

Sehen Sie sich dieses Video an, um zu erfahren, wie Sie mehrere Bilder nacheinander einfügen und die Einstellungen des Bildblocks ändern können.

Ein Bild skalieren

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

Ein Bild bearbeiten

Unser Drag & Drop Editor umfasst einen Fotoeditor, in dem Sie Ihr Bild zuschneiden und Filter, Text oder Textdesign hinzufügen können. Um zum Fotoeditor zu gelangen, klicken Sie auf Ihr Bild und dann auf die Schaltfläche Bearbeiten in den Bildeinstellungen.

Sie können auch ein Foto aus der Content-Bibliothek bearbeiten. Wählen Sie einfach das Bild aus und klicken Sie auf Bearbeiten.

Schaltfläche

Fügen Sie Schaltflächen hinzu, um einen Call to Action in Ihre E-Mails zu integrieren:

1. Ziehen Sie den Schaltflächenblock in Ihre Kampagne.
2. Ersetzen Sie den Call-to-Action-Text durch einen Text, der dem Content entspricht, zu dem Sie Ihre Empfänger weiterleiten möchten. 
   Sie können den Text mit Kontaktattributen personalisieren. 
3. Optional: Verwenden Sie die Menüleiste Textformatierung und die Schaltflächeneinstellungen im linken Menü, um Ihre Schaltfläche anzupassen. 
4. Klicken Sie auf das Link-Symbol, um einen Link zu Ihrer Schaltfläche hinzuzufügen und Empfänger auf die Seite Ihrer Wahl weiterzuleiten.

Sehen Sie sich das Video an, um zu erfahren, wie Sie Einstellungen wie Breite, Border radius, Zeilengröße und Hintergrundfarbe des Schaltflächen-Blocks ändern können.

Social

Mit dem Social-Block können Sie Ihre Empfänger auf Ihre Seiten in den sozialen Netzwerken weiterleiten.

1. Ziehen Sie in der Registerkarte Inhalt den Social-Block in Ihre Kampagne.
2. Behalten Sie die Standardeinstellungen für das Icon-Design bei oder wählen Sie die gewünschte Größe, den Stil, das Thema und den Abstand für Ihre Social Media Icons.
3. Kopieren Sie den Link zu Ihren Social-Media-Seiten in die jeweiligen Felder für die Icon-Einstellungen.
   Klicken Sie auf Mehr hinzufügen, um bei Bedarf weitere Social Media Icons und Links hinzuzufügen, oder klicken Sie auf das Papierkorb-Symbol, um ein Social Media Icon und einen Link aus dem Block zu löschen. 

Wenn Sie unter Kampagnen > Einstellungen > Google Analytics & Soziale Kanäle bereits Social-Media-Links hinzugefügt haben, werden die Links in den Feldern Icon-Einstellungen automatisch ausgefüllt.

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

HTML

Mit dem HTML-Block können Sie Ihren eigenen Code hinzufügen. Sie können Ihren Code eingeben oder kopieren und einfügen. Um eine Vorschau Ihres 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 zu erfahren, Sie wie Probleme mit Ihrem HTML-Code im HTML-Editor und Block vermeiden, lesen Sie unseren Artikel zu den Einschränkungen bei der Verwendung von HTML für Ihre E-Mail-Kampagnen. 

Trenner

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

Sehen Sie sich das Video an, um zu erfahren, wie Sie Einstellungen wie Dicke, Farbe, Form, Breite und Hintergrundfarbe für den Trenner-Block ändern können.

Header und Footer

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

Der Footer-Block ist essenziell, da er Ihren Empfängern mehr Informationen über Ihr Unternehmen zur Verfügung stellt und es ihnen ermöglicht, sich abzumelden oder ihre Einstellungen zu ändern. Er kann Folgendes enthalten:

Artikel

Wenn Sie die Shopify- oder Shopware-Plug-ins mit unserem neuen Drag & Drop Editor verwenden, sehen Sie den Content-Block Artikel.

1. Ziehen Sie den Content-Block Artikel in Ihren Newsletter.
2. Wählen Sie einen Artikel in der Suchleiste.
3. Klicken Sie auf Einfügen.

Sie sehen das Produktbild, den Produkttitel, die Produktbeschreibung und den Produktpreis. Die Produkt-URL ist automatisch mit dem Produktbild und der Schaltfläche verlinkt, solange Ihr Shop veröffentlicht ist.
Weitere Informationen finden Sie in unserem dedizierten Artikel Einen Produktblock in den Drag & Drop Editor einfügen (Neu).

⏭️ Nächste Schritte

• Teil 4: Festlegen des Design-Stils Ihrer E-Mail
• 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.