Wie nutze ich den CSS-Editor?

Der CSS-Editor bietet Ihnen die Möglichkeit, über CSS-Angaben Attribute zu definieren, die dann über ein Formular von Redakteuren verändert werden können. Dadurch bestimmen Sie selbst, welche Bereiche durch den Benutzer des Templates angepasst werden dürfen.

Zu diesem Zweck wird ein zentrales Style Sheet im Header erlaubt. Dies wird in der Laufzeit mit Hilfe des CSS-Inliner-Tools in einem Inline-CSS überführt, um eine optimale Darstellung in verschiedenen E-Mail-Clients zu gewährleisten.

Der CSS-Editor wird im neuen E-Mail-Builder V2 verwendet, kann aber in jedes beliebige Template übernommen werden.

Bitte kontaktieren Sie bei Fragen Ihren Account-Manager.

Oberfläche

Hier sehen Sie ein fertiges Formular, mit welchem der Redakteur zum Beispiel die Schriftart und -größe des Newsletters ändern kann. Sie haben die Möglichkeit, verschiedene Menüpunkte zu benennen und diesen wiederrum Unterpunkte zuzuordnen.

Übersicht des CSS-Editors

Wenn die Vorgaben erfüllt sind, befindet sich im Editor links oben ein Button „CSS editieren“.

Hinweise:

Der Beschriftung für @nav und @navItem sollen möglichst kurz sein.
Die Bezeichnungen für @nav und @navItem sind case-sensitiv. Daher muss auf Groß- und Kleinbuchstaben geachtet werden.
Die CSS-Datei muss valide sein.
Das CSS darf keine leeren Attribute enthalten.
Änderungen innerhalb von Media-Queries werden nicht im Vorschau-Fenster der promio.mail angezeigt. Öffnen Sie die Vorschau über „externer Link“ in einem neuen Browserfenster und verkleinern Sie dieses manuell, um diese Änderungen nachvollziehen zu können.
Verwenden Sie keine abgekürzten Schreibweisen für CSS-Eigenschaften.

Formularelemente

Die CSS-Eigenschaften wurden in Gruppen aufgeteilt. Zu jeder Gruppe wurde ein Editor-Baustein (kurz Editor) implementiert.

font-family: Auswahlliste Schriftart

In der nachfolgenden Tabelle finden Sie die Werte für font-family auf Grundlage derer der CSS-Editor ein Drop-Down zur Auswahl der Schrift erzeugt. Werden davon abweichende Werte verwendet, erstellt der CSS-Editor stattdessen ein Inputfeld.

Schriftart-Wert in CSS Quelltext	Schriftart in CSS Editor
Arial Arial,Helvetica Arial,Helvetica,sans-serif	Arial, Helvetica, sans-serif
'Times New Roman' 'Times New Roman', Times 'Times New Roman', Times, serif	'Times New Roman', Times, serif;
'Courier New' 'Courier New', Courier 'Courier New', Courier, monospace	'Courier New', Courier, monospace;
Georgia Georgia, 'Times New Roman' Georgia, 'Times New Roman', Times Georgia, 'Times New Roman', Times, serif	Georgia, 'Times New Roman', Times, serif
Verdana Verdana, Arial Verdana, Arial, Helvetica Verdana, Arial, Helvetica, sans-serif	Verdana, Arial, Helvetica, sans-serif
Geneva Geneva, Arial Geneva, Arial, Helvetica Geneva, Arial, Helvetica, sans-serif	Geneva, Arial, Helvetica, sans-serif