Startseite der Wissensbank Drag & Drop-Editor E-Mail-Blöcke und -Abschnitte
Fügen Sie neue Abschnitte in Ihre E-Mail ein und ordnen Sie die Blöcke neu an. Verwenden Sie Abschnitte mit verschiedenen Spalten und Blöcke mit Inhalten wie Bildern, Text oder Buttons. Mit dem E-Mail-Drag&Drop-Editor ist das Gestalten von E-Mails einfach und schnell, was unsere Kunden lieben und schätzen.
In diesem Artikel behandelte Themen:
Abschnitte werden verwendet, um eine E-Mail im Editor zu strukturieren. In den Abschnitten können Sie Ihren Inhalt aufteilen. Sie dienen als Container für Ihre Inhaltsblöcke. Sie können neue Abschnitte einfügen und andere löschen, während Sie die E-Mail gestalten, und die verschiedenen Abschnitte in Ihrer E-Mail individuell gestalten.
So funktionieren Abschnitte:
In den Einstellungen für globale Stile können Sie das Farbschema Ihrer E-Mail verwalten. Sie können Ihrer E-Mail auch eine universelle Hintergrundfarbe und einen Rahmen hinzufügen.
Es stehen 27 verschiedene Farbschemata zur Verfügung. Wählen Sie das, das Ihren Anforderungen am besten entspricht. Abschnitte und Blöcke können auch dann angepasst werden, wenn ein bestimmtes Farbschema ausgewählt wurde.
Mit der Option Hintergrundfarbe können Sie eine bestimmte Farbe für Ihren E-Mail-Hintergrund auswählen. Sie können eine bestehende Farben benutzen oder Ihren eigenen Farbhex-Code eingeben. Zusätzlich können einzelnen Abschnitten und Blöcken eine eigene Hintergrundfarbe zugewiesen werden.
Sie können den Hintergrund in der Option für den E-Mail-Rand auf volle Breite oder einen eingerahmter Hintergrund festlegen. Der Hintergrund in voller Breite verfügt über keine zusätzlichen Gestaltungsoptionen.
In der Option für den eingerahmten Hintergrund können Sie Folgendes bearbeiten:
Mit der Option Bereiche anzeigen können Sie alle Abschnitte in Ihrer E-Mail anzeigen und mit Bereiche verbergen wieder ausblenden. Hier können Sie auch auf einen beliebigen Block klicken, um diesen zu bearbeiten.
Blöcke sind die Bestandteile der Abschnitte, die den Inhalt E-Mail-Inhalt enthalten. Blöcke können als Gestaltungselemente und auch als Funktionalitäten verwendet werden. Jeder Inhaltsblock verfügt über unterschiedliche Gestaltungsoptionen.
Um Ihrer E-Mail einen Block hinzuzufügen, klicken Sie auf den gewünschten Block und ziehen Sie ihn in einen Abschnitt Ihrer E-Mail.
Im Folgenden sind die im E-Mail-Editor verfügbaren Blöcke aufgeführt.
Mit diesen Blöcken können Sie ein Bild hochladen oder Bilder auswählen, die sich bereits in Ihrer Galerie befinden. Um einen dieser Blöcke zu verwenden, ziehen Sie sie ihn in Ihre E-Mail und fügen Sie das Bild ein.
Ein Bildblock fügt Ihrem Layout lediglich ein Bild ein, während beim Bildkartenblock das Bild von einem Text innerhalb eines Rahmens begleitet wird.
Hier sehen Sie links einen Bildblock und rechts einen Bildkartenblock.
Verwenden Sie den Bildblock, wenn Sie ein einfaches Bild einfügen möchten.
Verwenden Sie den Bildkartenblock, wenn Sie Ihrem Bild eine Beschreibung hinzufügen müssen. Wenn Sie diesen Block verschieben, wird auch die Beschreibung verschoben.
Klicken Sie hier, um mehr darüber zu erfahren, was Sie mit einzelnen Bildblöcken tun können und wie Sie Bilder einfügen können.
Das könnte Sie interessieren:
Es gibt drei Arten von Bild+Text-Blöcken:
Klicken Sie hier, um zu erfahren, wie Sie einen Bild+Text-Block einfügen
Es gibt verschieden Blöcke mit denen Sie Bild und Text kombinieren können. Der Hauptunterschied zum Bildkartenblock besteht darin, dass dieser einen Rahmen verwendet der hier wegfällt. Sie können den Abstand wie im folgenden Beispiel an den Rand Ihres Layouts anpassen. (Bild+Text-Block links, Bildkartenblock rechts).
Wenn Sie in Ihrer E-Mail einen Text verwenden möchten, ziehen Sie den Textblock einfach an die gewünschte Stelle. Klicken Sie anschließend darauf und ersetzen Sie den Standardtext durch Ihren eigenen.
Lesen Sie das Glossar, um die Optionen Container und Inhalt in den Textblockeinstellungen im linken Bereich zu verstehen.
Verwenden Sie zum Bearbeiten Ihres Textes die Symbolleiste über Ihrer E-Mail. Dort finden Sie die gängigen Textbearbeitungsoptionen. Sie haben auch andere Bearbeitungsoptionen, z. B. das Konvertieren von Text in einen Anker, das Hinzufügen eines Links, eines Bildes oder sogar das Verknüpfen eines Dokuments.
Die Benchmark Email Rechtschreibprüfung prüft Ihren Inhalt, um sicherzustellen, dass die Rechtschreibung in Ihrer E-Mail korrekt ist. Die Sprache für die Rechtschreibprüfung wird standardmäßig auf die von Ihrem Konto bevorzugte Sprache eingestellt. Sie können die Sprache ändern oder die Funktion Rechtschreibprüfung in der oberen Menüleiste der E-Mail deaktivieren.
Um die Rechtschreibprüfung in Aktion zu sehen, öffne einen beliebigen Textblock und beginne zu schreiben. Falsch geschriebene Wörter sind rot unterstrichen. Du kannst mit der rechten Maustaste auf das Wort klicken, um die richtige Schreibweise auszuwählen oder die Warnung zu ignorieren. Die Option Mehr öffnet eine weitere Liste mit verfügbaren Wörtern.
ACHTUNG
Rechtsklick funktioniert nicht: Einige Betriebssysteme haben Standardeinstellungen für Rechtsklickgesten. Prüfen Sie Ihre Maus- oder Trackpad-Einstellungen, wenn ein Rechtsklick nicht zu den Vorschlägen für die Rechtschreibung führt.
HINWEIS
Wenn du die Option Ignorieren wählst, wird die Einstellung für diesen Fall gespeichert. Wenn du den Block schließt und später zu ihm zurückkehrst, wird das falsch geschriebene Wort als falsch geschrieben angezeigt.
Die Funktion Rechtschreibprüfung ist derzeit in den folgenden Sprachen verfügbar.
Kopieren Sie Ihre Inhalte aus anderen Quellen und fügen Sie sie mit der Funktion Einfaches Einfügen ein. Die Funktion Einfaches Einfügen macht das Kopieren und Einfügen von Inhalten aus anderen Quellen wie Ihrer Website, Google und Microsoft Dokumenten schnell und einfach. Sie können die ursprüngliche Formatierung entfernen oder beibehalten, um sie an Ihre anderen Seiten anzupassen.
Um die Funktion „Einfach einfügen“ zu nutzen, befolge die folgenden Schritte.
ACHTUNG
Kopieren und Einfügen
Wenn Sie einen Text haben, den Sie kopieren und in Ihre E-Mail einfügen möchten, empfehlen wir die Option Einfügen. Mit dieser Option werden alle verborgenen Formate entfernt, die Ihr Textdesign beeinträchtigen könnten.
Quellcode
Um Quellcode einzufügen oder zu bearbeiten, klicken Sie auf das Codesymbol .
Wenn diese beiden Optionen nicht angezeigt werden, klicken Sie in der Symbolleiste auf das Symbol für Weitere Optionen.
Hinweis: In einigen Fällen wird beim Bearbeiten eines Textblocks das TinyMCE-Logo angezeigt. TinyMCE ist ein Drittanbieter, mit dem wir unseren Drag&Drop-Editor besser und schneller machen. Das Logo wird nicht in Ihren E-Mails angezeigt, sondern nur, während Sie einen Textblock bearbeiten.
Die Verwendung von Videos in Ihren E-Mails kann sehr hilfreich sein.
Wenn Sie erfahren möchten, wie Sie ein Video in Ihre Videogalerie hochladen und in Ihrem Layout einfügen können, klicken Sie hier.
Verwenden Sie Trenner, um Abstände zwischen Elementen der E-Mail zu markieren und die Seite zu strukturieren. Um einen Trenner zu benutzen, ziehen Sie ihn in an die gewünschte Stelle. Entdecken Sie hier alle Einsatzmöglichkeiten von Trennern.
Der CTA-Button (Call to Action) ist der interessanteste Teil Ihrer E-Mail. Hier wird entschieden, ob das Design der Kampagne und die gesamte Arbeit erfolgreich waren. Um einen Button einzufügen, ziehen Sie ihn an die gewünschte Position. Im linken Bereich sehen Sie Optionen, mit denen Sie die Buttons definieren können.
Weitere Informationen zu den Bearbeitungsoptionen für Buttons finden Sie in unserem Glossar. Lesen Sie weiter, um den Inhalt des Buttons zu konfigurieren.
Die Social-Media-Blöcke sind unerlässlich. Unser Editor bietet Ihnen zwei Arten von Blöcken, um Ihre sozialen Netzwerke hinzuzufügen. Um einen der Blöcke zu verwenden, ziehen Sie ihn an die Stelle Ihrer Wahl.
Mit dem Social-Folgen-Block können Sie Ihr Social Media-Symbol oder das Symbol sowie einen Text einfügen. Mit diesem Block können Sie bis zu 20 verschiedene Dienste nutzen, darunter Facebook, Twitter, WhatsApp, Linkedin, YouTube, Pinterest, RSS, Vimeo und TripAdvisor.
Mit dem Social-Teilen-Block können Sie Facebook, Twitter, Linkedin, Myspace und Instapaper benutzen. Mit diesem Block können Benutzer Ihre E-Mails direkt auf den genannten sozialen Netzwerken teilen.
Wenn Sie Ihre E-Mail-Empfänger auf Ihre sozialen Netzwerke leiten möchten, benutzen Sie Social Folgen. So können sie auf die gewünschten sozialen Medien klicken und sie “liken” oder ihnen folgen.
Wenn Sie möchten, dass die Benutzer Ihre Inhalte teilen, verwenden Sie den Block Social Teilen.
Informationen zum Verwenden der Container-Einstellungen finden Sie im Glossar.
Befolgen Sie diese Anweisungen, um einen Dienst in beiden Blöcken hinzuzufügen:
Wenn Sie mit der Maus über ein soziales Symbol fahren, können Sie es außerdem verschieben oder löschen.
Die Navigationsleiste kann verwendet werden, um Ihre E-Mail-Empfänger mit einem Anker zu anderen Teilen Ihrer E-Mail zu leiten, oder sie kann für externe Links verwendet werden.
So fügen Sie eine Navigationsleiste ein:
So passen Sie eine Navigationsleiste an
Informationen zur Tab Container finden Sie im Glossar.
Der Ecommerce-Block kann verwendet werden, um Produkte in Ihren E-Mails zu bewerben und zu verkaufen.
Der Ecommerce-Block enthält Folgendes:
Um den Produktblock zu verwenden, klicken Sie auf den Block und ziehen Sie ihn in einen Abschnitt in Ihrer E-Mail.
Führen Sie die folgenden Schritte aus, um Ihren E-Commerce-Block anzupassen.
Wenn Sie keines der Blockelemente verwenden möchten, schalten Sie sie einfach auf der Registerkarte Inhalt aus.
Hier finden Sie einige Beispiele für die Verwendung und Gestaltung des Ecommerce-Blocks
Um loszulegen, klicken Sie auf den Block und ziehen Sie ihn in den gewünschten Bereich in Ihrer E-Mail.
Um den Shopify-Produktblock zu verwenden, benötigen Sie ein aktives, kostenpflichtiges Shopify-Konto. Wenn Sie diesen Block zum ersten Mal verwenden, müssen Sie Shopify mit Ihrem Benchmark-Konto integrieren. Um zu erfahren, wie Sie Ihren Shopify-Shop mit Benchmark integrieren, klicken Sie hier.
Wenn Sie Ihr Shopify-Konto erfolgreich mit Benchmark integriert haben, sehen Sie eine Liste Ihrer verfügbaren Shopify-Produkte.
Wählen Sie eines Ihrer verfügbaren Produkte. Die Blöcke füllen die Produktinformationen automatisch mit den Details in Shopify aus.
Der Shopify-Produktblock enthält Folgendes:
Important
Wenn Ihr Shopify-Konto nicht das Administratorkonto ist, benötigen Sie Produkte Berechtigungen. Um mehr über Shopify-Benutzerberechtigungen zu erfahren, klicken Sie hier.
Sie können sich immer nur mit einem Shopify-Shop verbinden. Wenn Sie die Option Shop ändern verwenden, werden alle vorherigen Shopify-Produkte entfernt.
Hier finden Sie einige Beispiele dafür, wie der Shopify-Produktblock verwendet und gestaltet werden kann..
Verkürzen Sie Ihre Designzeit mit Gespeicherten Blöcken. Design-Blöcke können gespeichert und in zukünftigen Designs wiederverwendet werden. Das Styling, der Text und die Bilder des Blocks werden gespeichert, wenn Sie den Block sichern. Sobald der Block zu Ihrem Design hinzugefügt wurde, können Sie den Inhalt ändern, während der ursprünglich gespeicherte Block unverändert bleibt.
Um einen Block zu speichern, bewegen Sie den Mauszeiger über den Block in Ihrem Design und klicken Sie auf die Option Block speichern. Geben Sie dem Block einen Namen und klicken Sie auf Speichern & schließen.
So verwenden Sie einen Gespeicherten Blöcke:
Gespeicherte Blöcke löschen:
Wenn es keine gespeicherten Blöcke mehr gibt, können Sie den gespeicherten Blöcke aus Ihrem Design löschen.
Hier einige Beispiele, wie Sie Ihre E-Mails mithilfe von Abschnitten optimieren können.
Die folgenden E-Mail-Beispiele zeigen die Abschnitte und Blöcke, die wir im gesamten E-Mail-Design verwendet haben.
Wir haben zunächst eine Navigationsleiste im Kopfbereich hinzugefügt. Der Titel in diesem Beispiel verwendet den linken Seitenleistenabschnitt. In der zweiten Spalte haben wir die Bilder und den Text mithilfe von Bildkartenblöcken hinzugefügt. Schließlich haben wir in der unteren linken Spalte Social-Media-Symbole eingesetzt und Abonnenten-Feedback angefordert.
Hier haben wir eine E-Mail mit ein- und zweispaltigen Abschnitten erstellt. Wir haben auch einen gerahmten Hintergrund hinzugefügt und die Option „Randradius“ in den globalen Einstellungen verwendet, um den Text der E-Mail hervorzuheben.
In diesem letzten Beispiel haben wir eine E-Mail mit Abschnitten mit mehreren Spalten erstellt. Wir haben einen Trenner verwendet, um den Abstand zwischen den Abschnitten anzuzeigen. Wie Sie in der gesamten E-Mail sehen können, haben wir Bild-, Text-, Button-, Social-Media- und einen Videoblock verwendet.
Die Containereinstellungen variieren je nach dem Block, den Sie bearbeiten.
Hintergrundfarbe
Mit dieser Option können Sie die Hintergrundfarbe eines Elements festlegen. Um es zu verwenden, klicken Sie auf den Farbkreis und wählen Sie eine Farbe aus der Farbleiste. Wenn Sie den Hex-Code haben, fügen Sie ihn direkt in das Feld ein. Klicken Sie auf Speichern, wenn Sie fertig sind. Durch die Option Zurücksetzen wird das ursprüngliche Aussehen des Elements wiederhergestellt.
Rand- und Linienstil
Für einige Elemente ist die Rahmenoption verfügbar. Sie können einen Farbrand festlegen, indem Sie in den Farbkreis klicken und dann eine Farbe aus der Farbleiste auswählen. Sie können auch hier Hex-Codes verwenden. Wählen Sie für den Rahmenstil aus den neun verfügbaren Linienstilen aus und fügen Sie dann eine Dicke von 0 bis 99 hinzu. Wenn Sie keinen Rand möchten, ändern Sie einfach die Farbe auf transparent oder die Dicke der Linie aufi null. Durch die Option zum Zurücksetzen wird das ursprüngliche Aussehen des Elements wiederhergestellt.
Randradius
Für einige Elemente ist die Option Randradius verfügbar. Diese Option legt fest, wie abgerundet die Ecken eines Elements sein können. Sie können den Radius von 0 bis 20 einstellen. Wenn Sie fertig sind, können Sie das Kontrollkästchen Radius auf alle Buttons im Block anwenden aktivieren. Dadurch haben alle Buttons den gleichen Radius.
Rillengröße
Die Rillengröße ist eine Option, die in einigen Blöcken wie der Navigationsleiste, Social Folgen und Social Teilen verfügbar ist. Diese Option definiert den Abstand zwischen einem Element und einem anderen. Schieben Sie den grünen Punkt von 0 auf 20, um die Rillengröße einzustellen.
Padding und Rand
Paddings und Ränder sind normalerweise Optionen, die auf der Inhalts-Tab verfügbar sind. Beide beziehen sich auf den Raum, der ein Element umgibt. Sie können das Padding oder den Rand einstellen, indem Sie die Leiste verschieben.
Ausrichtung
Sie können die Position eines Elements einstellen, indem Sie auf die gewünschten Ausrichtungsoptionen klicken: Mitte, links, rechts, unten oder oben.
Zeilenhöhe
Die Option für die Zeilenhöhe ist nur für einen Textblock verfügbar. Die verfügbaren Optionen sind Einzeln, 1.25, 1.5 und Doppelt.
Hex-Code
Der Hex-Code ist der Wert, der eine Farbe darstellt. Dieser Code beginnt mit einem Nummernzeichen (#) und wird von sechs Zeichen gefolgt. Beispiel: #CFCFDA Die Zeichen können Zahlen oder Buchstaben sein. Hex-Codes können verwendet werden, um Markenfarben hinzuzufügen. Wenn Sie sich nicht sicher sind, welche Hex-Code-Farben Sie verwenden, können Sie eine Design-Software oder einen Farbwähler verwenden.
Wenn Sie Fragen haben, wenden Sie sich bitte an unser Support-Team.