E-Mails & SMS
E-Mail-Builder in KlickTipp nutzen
Du fragst Dich: Wie kann ich bei KlickTipp E-Mails erstellen und die Inhaltsgestaltung umsetzen? In diesem Beitrag zeigen wir Dir, wie Du den E-Mail-Builder nutzen kannst.
Schon gewusst?
Um den E-Mail-Builder nutzen zu können, musst Du zunächst eine neue E-Mail oder einen neuen Newsletter anlegen.
Falls Du E-Mails bereits mit dem Rich Text Editor erstellt hast, kannst Du diese leider nicht im E-Mail-Builder öffnen. Wenn Du Inhalte aus zuvor mit dem Rich Text Editor angelegten E-Mails in den E-Mail-Builder kopieren möchtest, kannst Du dies einfach per Copy & Paste tun.
Schritt-für-Schritt-Anleitung
- Klicke im Menü auf Kampagnen → E-Mails / SMS → Neue Kampagnen-E-Mail oder Kampagnen → Newsletter → Neuer E-Mail-Newsletter.
- Benenne die E-Mail.
- Wähle → E-Mail-Builder und klicke auf → Kampagnen-E-Mail erstellen bzw. → Newsletter erstellen.
- Nimm die benötigten Einstellungen für E-Mail-Adressen vor. Wähle eine Signatur und schreibe einen Preheader. Bei Bedarf kannst Du weitere Einstellungen vornehmen.
- Du hast die Möglichkeit, diese Einstellungen automatisch aus einer bereits erstellten E-Mail zu übernehmen. Gib im Feld → Einstellungen aus einer anderen E-Mail kopieren den Namen der E-Mail ein und wähle sie aus.
- Klicke auf → Speichern und weiter.
- Wähle ein Template aus.
E-Mail-Builder – Überblick
Im E-Mail-Builder kannst Du die Vorlage nach Deinen Wünschen anpassen. Im Menü des Editors stehen Dir folgende Möglichkeiten zur Verfügung:
- Einstellungen – mit diesem Button kommst Du zu den Einstellungen der E-Mail zurück.
- Vorschau – dieser Button zeigt Dir eine Vorschau, wie sie für den Empfänger aussehen wird.
- Raster – Klicke auf diesen Button, um eine optische Hilfe für das Layout Deiner E-Mail zu erhalten.
- Templates – kopiere Inhalte, die Du mit dem E-Mail-Builder erstellt hast. Du kannst auch komplette Templates importieren.
- Alles löschen – Mit diesem Button kannst Du den gesamten Inhalt der E-Mail löschen.
Hinweis: Wähle diese Option sorgfältig aus, da dieser Schritt nicht rückgängig gemacht werden kann. - Freigeben – über diesen Button kannst Du die E-Mail freigeben und mit KlickTipp versenden.
Hinweis: Wenn Du auf den Button klickst, wird noch keine E-Mail versendet.
Schon gewusst?
Wenn Du Änderungen an einer E-Mail vorgenommen hast, klicke bitte erneut auf den Button → Freigeben. Ansonsten wird der aktuelle Stand lediglich im Editor gespeichert.
Der Gestaltungsbereich
Bis auf den Befehl → Alles löschen kannst Du jeden Deiner Schritte rückgängig machen. Dazu stehen Dir die Werkzeuge am unteren linken Bildschirmrand zur Verfügung.
Wähle hier z. B. ganz bestimmte zeitliche Punkte in Deiner Bearbeitung über das Uhrsymbol aus. Jeder einzelne Schritt wird dokumentiert und kann durch erneutes klicken ausgewählt werden. Das Layout wird dann genau so wieder hergestellt, wie es zum gewählten Zeitpunkt aussah.
Alternativ kannst Du die Vor- und Zurück-Buttons mit dem Pfeil-Symbol anklicken.
Menüpunkt → Inhalt
Hier kannst Du in Deiner E-Mail verschiedene Bausteine hinzufügen. Ziehe den benötigten Baustein mit gedrückter Maustaste an die gewünschte Stelle im E-Mail-Inhalt. Die Position kann im Nachhinein beliebig verändert werden.
Für den jeweiligen Inhaltstyp stehen verschiedene Bearbeitungsmöglichkeiten zur Verfügung.
Schon gewusst?
Die Bilder in der Free Stock Photo Gallery unseres neuen E-Mail-Builders stehen unter der Creative Commons Zero Lizenz (CC0). Das bedeutet, sie können auch außerhalb von E-Mails frei verwendet werden.
- Für textbasierte Inhalte öffnet sich ein Editor nach dem Klick auf das Element.
- Zusätzlich siehst Du auf der rechten Seite erweiterte Eigenschaften und Optionen.
- Bei Inhalten wie Text, Bildern, Icons etc. siehst Du rechts die Bearbeitungsmöglichkeiten. Hier kannst Du Dinge wie Textfarbe und Zeilenabstand verändern, aber auch z.B. den Innenabstand für Bilder.
- Formatierungen wie Schriftart, Schriftgröße, Fettschrift, Kursiv, Textausrichtung mittig usw. findest Du in der Bearbeitungsleiste direkt über dem Text.
Menüpunkt → Zeile
Dort werden Dir unterschiedliche Zeilenlayouts angezeigt, die Du im Layout nutzen kannst.
- Wenn Du links im Layout auf einen Bereich außerhalb des E-Mail-Inhalts klickst, wird die komplette Zeile ausgewählt. Du kannst sie beliebig im Inhalt verschieben. Klicke und ziehe dazu das Kreuz auf der linken Seite.
- Ebenso kannst Du eine Zeile löschen oder kopieren. Klicke dazu am rechten Rand entweder auf den Papierkorb oder auf das Kopier-Symbol.
- Wenn eine Zeile angewählt ist, erscheinen auf der rechten Seite die Zeilen- und Spalteneigenschaften.
Menüpunkt → Allgemein
Hier kannst Du allgemeine Einstellungen vornehmen. Wähle die Breite des Layouts, Standardschrift und Farben etc.
Wenn Du mit der Gestaltung Deiner E-Mail fertig bist, kannst Du die E-Mail über den Button → Freigeben. Danach kannst Du sie mit KlickTipp versenden.
Platzhalter nutzen
Über → Platzhalter kannst Du bestimmte Informationen eines Kontakts in einer E-Mail verwenden. Diese Informationen werden aus dem Stammsatz gezogen. Individuell für jeden Kontakt werden sie über die Platzhalter in die E-Mail eingefügt.
Der Platzhalter → %Subscriber:CustomFieldFirstName% fügt z. B. den Vornamen ein. Ist dieser nicht im Stammsatz angegeben, bleibt der Platzhalter leer. Über den Editor im Textbereich erhältst Du Zugriff auf alle vorhandenen Platzhalter.
Schon gewusst?
Bitte beachte, dass der Platzhalter für die Signatur stets in der E-Mail enthalten sein muss. Nur so kann KlickTipp diese automatisch auswählen, wie vorher in den Einstellungen der E-Mail festgelegt.
- Die Platzhalter sind in unterschiedliche Kategorien und Abschnitte aufgeteilt. Es gibt → Vordefinierte Felder und → Zusätzliche Felder. Dieser Abschnitt erscheint nur, wenn Du zusätzliche Felder angelegt hast.
- Unter dem Menü → Absender-Angaben findest Du den Platzhalter → Signatur. Fügst Du diesen ein, greift er auf die in den Einstellungen der E-Mail definierte Signatur zu.
Signatur über Links einfügen
Du kannst statt dem Platzhalter auch eine individuelle Signatur in der E-Mail nutzen. Diese kannst Du aus mehreren Links zusammensetzen.
- Klicke auf → System-Links und Du erhältst eine Ansicht aller verfügbaren System-Links. Diese kannst Du durch Klick auf die Schaltflächen in Deinen Text einfügen. Die übrigen Infos für Deine Signatur kannst Du durch normalen Text ergänzen.
- Eine Übersicht der meist genutzten Platzhalter findest Du im Beitrag: Platzhalter in E-Mails einfügen.
Bilder & Emojies nutzen
Lizenzfreie Bilder
Bilder direkt in Deinem E-Mail-Konto bearbeiten
Giphy Sticker einfügen
Giphy-GIFs einfügen
Emojis in E-Mails einfügen
E-Mails für Mobile & Desktop unterschiedlich gestalten
Mobile Ansicht verbessern – E-Mails für mobile Endgeräte anpassen
Kostenfreie E-Mail Designvorlagen
Drag & Drop Video-Modul
Spalten-Management
Freebie in Deine E-Mail einbinden
Manuelle Tags: Mit einer E-Mail unterschiedliche Inhalte senden
Smart Tags: Mit einer E-Mail unterschiedliche Inhalte senden (conditional rows)
Schon gewusst?
Die Einstellung → Bedingung erscheint nicht im Editor, wenn Du Dich im Template-Modus befindest.
Persönliche E-Mails im E-Mail-Builder schreiben
Anhang – Datei an eine E-Mail anhängen
Du kannst eine Datei über einen Textlink oder einen Button als Anhang versenden. Dies funktioniert ähnlich wie ein E-Mail-Anhang in Deinem E-Mail-Programm.
Folgende Dateitypen kannst Du hochladen:
image
pdf
Office
Video
Audio
zip
Die maximale Dateigröße ist auf 25MB beschränkt.
Wichtig: Die jeweiligen Dateiendungen müssen immer klein geschrieben werden!
- Definiere einen Textbereich oder einen Button, den Du verlinken möchtest.
- Im Bereich → Inhalt kannst Du über → Datei Deine Datei verlinken.
- Klicke auf → Hochladen, → Importieren oder auf → Suche nach lizenzfreien Fotos. Wahlweise kannst Du eine bereits vorhandene Datei einfügen.
- Automatisch wird dadurch die URL zur Datei in das entsprechende Feld eingetragen. Klickt der Kontakt in der E-Mail auf den Button, wird die verlinkte Datei sofort geladen
Anker-Links in E-Mails verwenden
Mit Anker-Links kannst Du direkt an eine bestimmte Stelle einer E-Mail springen. Diesen fügst Du im E-Mail-Builder über einen HTML-Inhaltsbaustein ein. Nach Klick auf den Link des Textankers wird direkt dort hin gesprungen.
Schon gewusst?
Nicht alle E-Mail-Clients unterstützen Ankerlinks. Stelle daher sicher, dass die Empfänger den Newsletter auch ohne diese Funktionalität gut lesen können.
In den Inhaltseigenschaften gibst Du folgenden Code ein:
<a name="Anker-Name"></a><br />
Kopieren
- Anstelle von → Anker-Name wählst Du einen individuellen Namen. Diesen verwendest Du später bei der Verlinkung.
- Markiere den Textbereich, von dem Du zum gesetzten Anker verlinken willst. Klicke auf das Link-Symbol in der Werkzeugleiste.
- Füge im Pop-Up unter → Link-Typ URL den individuellen Anker-Namen ein. Verwende davor das #-Zeichen.
- Der Textbereich ist nun verlinkt. Wenn ein Empfänger auf den Link klickt, wird er direkt an die gewünschte Stelle geführt.
E-Mail Template im E-Mail-Builder erstellen
Mit einem E-Mail Template kannst Du Deine E-Mail noch schneller erstellen. Auf Knopfdruck holst Du Dir Dein vordefiniertes Design und wiederkehrende Inhalte in den Editor. So kannst Du direkt mit dem Inhalt loslegen. Wir zeigen Dir, wie Du ein Template ganz einfach erstellen kannst.
- Klicke im Menü → Kampagnen auf → E-Mail Templates.
- Klicke auf → Neues Template erstellen.
- Vergebe einen Namen für die Vorlage und klicke auf → Absenden.
- Wähle aus den KlickTipp Templates oder aus → Meine E-Mails eine Vorlage aus und klicke auf → Anwenden.
- Du befindest Dich jetzt im Bearbeitungsdialog des E-Mail-Builder für das Template. Du kannst es nach Deinen Wünschen entsprechend anpassen. Klicke danach oben rechts auf → Freigeben.
- Klicke auf → Meine Templates. Dein gerade erstelltes Template erscheint in der Übersicht darunter.
- Wenn Du mit dem Maus-Cursor über die Kachel des Templates fährst, erscheinen zwei Icons. Über das Info-Symbol kannst Du Dir eine Vorschau des Templates anzeigen lassen. Über das andere Icon mit dem Stift-Symbol gelangst Du in den Bearbeitungsdialog.
- Um Dein Template mit einer bereits angelegten E-Mail zu verwenden, klicke auf → Anwenden.
Erlaubte HTML-Tags und Attribute
Diese HTML-Tags und Attribute kannst Du mit dem HTML-Baustein im E-Mail-Builder verwenden.
HTML-Tags
a, abbr, acronym, address, area, b, bdo, big, blockquote, button, caption, center, cite, code, colgroup, dd, del, dfn, dir, div, dl, dt, em, fieldset, font, form, h1, h2, h3, h4, h5, h6, i, ins, kbd, label, legend, li, map, menu, ol, optgroup, option, p, pre, q, s, samp, select, small, span, strike, strong, sub, sup, table, tbody, td, textarea, tfoot, th, thead, u, tr, tt, u, ul, var
HTML-Attribute
general attributes: style, id, class, data-*, title
a: href, name, target
img: align, alt, border height, hspace, src, vspace, width, usemap
table: align, bgcolor, border, cellpadding, cellspacing, width
tbody: align, valign
td: align, bgcolor, colspan, height, rowspan, valign, width
tr: align, bgcolor, valign
tfoot: align, valign
th: align, bicolor, colspan, height, rowspan, valign, width
thead: align, valign
li: type
map: name
area: alt, coords, href, shape, target
