Inhaltsverzeichnis
Eine aktuelle (englischsprachige) Version dieses Dokuments liegt hier. Diese ist in promio.connect im Hilfebereich einsehbar.
E-Mail Editor Templates
Hier geht es darum dem Designer die Möglichkeit zu geben, von Redakteuren veränderbare Bereiche seines Designs (Templates) zu definieren.
Der Designer kann dafür beim Entwurf seines Templates auf die von uns zur Verfügung gestellten Tags in den Namensräumen pme: und pm: zugreifen.
Das so entwickelte Template kann dann mit dem in promio-mail integrierten E-Mail Editor von Redakteuren verwendet und angepasst werden. Dabei kann der Redakteur nur noch die vorher definierten Bereiche bearbeiten.
- Beispiel Template
<html> <head> <title> Example template </title> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> </head> <body> <h1> <pme:singleline class="" style="" label="Ueberschrift"> Editierbarer Text im Template. Redakteur kann nur reinen Text eingeben. </pme:singleline> </h1> <p> Statischer, nicht editierbarer, Text des Templates. </p> <img pmedit="true" pmscale="width" width="400px" src="bild.png" /> <pme:multiline> <h2> Text mit HTML Auszeichnung </h2> <p> Der Redakteur hat die Möglichkeit der Text-Formatierung per HTML. </p> </pme:multiline> <pme:repeater> <pme:layout name="LayoutAuswahl_1"> <h2>Layoutvorlage 1 für Repeater</h2> <p>Beliebiges HTML</p> </pme:layout> <pme:layout name="LayoutAuswahl_2"> <h2>Layoutvorlage 2 für Repeater</h2> <p> <pme:multiline>Beliebiges, editierbares, HTML</pme:multiline> </p> </pme:layout> <pm:repeatercontent> <h2>Listeninhalt</h2> <h3><pme:singleline>tolles singleline </pme:singleline></h3> </pm:repeatercontent> </pme:repeater> </body> </html>
HTML Erweiterung
Templates für den promio-mail E-Mail Editor entsprechen standard HTML-Dokumenten, die um promio-mail spezifische Tags und Attribute erweitert werden können:
Übersicht
| HTML Erweiterung | Typ | |
|---|---|---|
| Tags | ||
| <pme:singleline> | Tag, editierbar | Nur-Text (kein HTML) Eingabe |
| <pme:multiline> | Tag, editierbar | HTML-Text Eingabe |
| <pme:repeater> | Tag, editierbar | Struktur für Listendarstellung |
| <pme:layout> | Tag, editierbar | Vorlage für Listeneinträge |
| <pm:repeatercontent> | Tag | Struktur für Listendarstellung |
| Attribute | ||
| pmedit | Attribut | Nur für <img> Tags. Legt die Editierbarkeit bei Bildern fest. |
| pmscale | Attribut | Nur für <img> Tags. Legt die Abmessung bei änderbaren Bildern fest. |
Tags
pme:singleline
Dieses Element legt Bereiche fest, die von Redakteuren editieren werden können. Es kann dabei nur reiner Text, ohne HTML Auszeichnung, eingegeben werden. Das Tag kann sowohl alleine stehen als auch innerhalb anderer Elemente eingefügt werden.
Beispiel
<pme:singleline label="Ueberschrift"> Veränderbarer Text </pme:singleline>
Attribute
| Erlaubte Attribute | |
|---|---|
| Standard HTML Attribute (s. Standard HTML Attributes) | |
| label | Beschriftung für den Editor |
pme:multiline
Dieses Element legt Bereiche fest, die von Redakteuren editiert werden können. Es dürfen dabei HTML Auszeichnungen verwendet werden. Das Tag kann sowohl alleine stehen als auch innerhalb anderer Elemente eingefügt werden.
Beispiel
Attribute
| Erlaubte Attribute | |
|---|---|
| Standard HTML Attribute (s. Standard HTML Attributes) | |
| label | Beschriftung für den Editor |
pme:repeater
Das Element <pme:repeater> definiert einen Bereich mit sich wiederholenden Blöcken.
Ein <pme:repeater> Bereich enthält eine beliebige Anzahl (jedoch mindestens einen) von <pme:layout> Blöcken, die dem Redakteur zum auffüllen des Bereiches zur Auswahl gestellt werden.
Beispiel
<pme:repeater> <pme:layout name="LayoutAuswahl_1"> <h2>Layoutvorlage 1 für Repeater</h2> <p>Beliebiges HTML</p> </pme:layout> <pme:layout name="LayoutAuswahl_2"> <h2>Layoutvorlage 2 für Repeater</h2> <p> <pme:multiline>Beliebiges, editierbares, HTML</pme:multiline> </p> </pme:layout> </pme:repeater>
Benötigt
| Benötigte Tags |
|---|
| <pme:layout> |
pme:layout
Das Element <pme:layout> definiert einen Block eines <pme:repeater> Bereiches. Es darf nur innerhalb von <pme:repeater> vorkommen. Es können beliebig viele <pme:layout> Blöcke innerhalb eines <pme:repeater> definiert werden.
Der Redakteur hat die Möglichkeit, einen oder mehrere <pme:layout> Blöcke in einem <pme:repeater> hinzuzufügen, zu verschieben oder zu löschen. Auch das mehrmalige hinzufügen ein und desselben Blocks ist möglich.
Die Angabe des Attribut name ist erforderlich. Es definiert die Anzeige in der Auswahl der möglichen Blöcke, die einem <pme::repeater> hinzugefügt werden können.
<pme:layout> darf nur innerhalb von <pme:repeater> verwendet werden.
Beispiel
<pme:repeater> <pme:layout name="LayoutAuswahl_1"> <h2>Layoutvorlage 1 für Repeater</h2> <p>Beliebiges HTML</p> </pme:layout> <pme:layout name="LayoutAuswahl_2"> <h2>Layoutvorlage 2 für Repeater</h2> <p> <pme:multiline>Beliebiges, editierbares, HTML</pme:multiline> </p> </pme:layout> </pme:repeater>
Attribute
| Erlaubte Attribute | |
|---|---|
| Standard HTML Attribute (s. Standard HTML Attributes) | |
| name | Erforderlich. Gibt den Namen des Layouts an, der dem Redakteur zur Auswahl gestellt wird. |
pm:repeatercontent
Ermöglicht es vordefinierte Blöcke in einen <pme:repeater> einzubinden.
Das Verhalten von <pm:repeatercontent> ist ähnlich wie von <pme:layout> Blöcke mit dem Unterschied, das <pm:repeatercontent> Blöcke standardmäßig angezeigt werden, wohingegen <pme:layout> Blöcke zuvor von einem Redakteur manuell dem <pme:repeater> hinzugefügt werden müssen.
Der Redakteur hat die Möglichkeit, <pm:repeatercontent> Blöcke zu verschieben oder zu löschen.
<pme:repeatercontent> darf nur innerhalb von <pme:repeater> verwendet werden.
Beispiel
<pme:repeater> <pme:layout name="LayoutAuswahl_1"> <h2>Layoutvorlage 1 für Repeater</h2> <p>Beliebiges HTML</p> </pme:layout> <pme:layout name="LayoutAuswahl_2"> <h2>Layoutvorlage 2 für Repeater</h2> <p> <pme:multiline>Beliebiges, editierbares, HTML</pme:multiline> </p> </pme:layout> <pm:repeatercontent> <h2>Blockvorgabe</h2> <p> <pme:multiline>Freier Text....</pme:multiline> </p> </pm:repeatercontent> </pme:repeater>
Attribute
pmedit
Das Attribute pmedit legt fest, ob die Quelle (das src Attribute) eines Bildes vom Redakteur bearbeitet werden kann. Wird das Attribut weggelassen, kann die Bildquelle auch nicht bearbeitet werden.
Beispiel
<img pmedit="true" src="bild.png" pmscale="width" width="400px" />
Werte
| Mögliche Werte des Attributes | |
|---|---|
| Wert | Erklärung |
| „true“ | Erlaubt das editieren der Bildquelle im Attribute src |
Nutzbarkeit
| Erlaubt in Tag |
|---|
| <img> |
pmscale
Mit Attribut pmscale kann angegeben werden, das ein Bild auf eine bestimmte Abmessung skaliert wird. Es wird dabei ein neues Bild mit den gewünschten Abmessung erstellt und eingebunden; das original Bild bleibt davon unberührt und kann jederzeit wieder verwendet werden.
Das Attribut kommt vor allem im Zusammenhang mit dem Attribut ''pmedit'' zum Tragen und stellt sicher, das unabhängig von der gewählten Bildquellen, die passenden Größe angezeigt wird.
Beispiel
<img pmscale="width" width="400px" pmedit="true" src="bild.png" />
Werte
| Mögliche Werte des Attributes | |
|---|---|
| Wert | Erklärung |
| „width“ | Skaliert das Bild auf die im Attribute width angegebene Breite. |
| „height“ | Skaliert das Bild auf die im Attribute height angegebene Höhe. |
| „crop“ | Schneidet das Bild am linken bzw. unteren Rand ab, um die im Attribut height und/oder width angegebene Größe zu erhalten. |
Nutzbarkeit
| Nutzbar für Tag |
|---|
| <img> |
Seiten-Werkzeuge
