Im Source Modus können Inhaltsersteller Nachrichten im HTML-Code ganz neu erstellen oder eine importierte HTML-Datei direkt im Code ändern. Der QuellcodeL-Inhaltseditor ermöglicht es Benutzern ausserdem, Selligent-Inhaltskomponenten zu ziehen und im Quellcode abzulegen.
Wichtiger Hinweis: Die Verwendung von Tilden im Quellcode kann zu unerwünschtem Verhalten beim Versenden der Nachricht führen. Um die Verwendung von Tilden, zum Beispiel in CSS, zu ermöglichen, muss die Tilde in „Escape“-Zeichen gesetzt werden.
Beispiel: Statt
<a href="https://support.google.com/android/answer/9075928?hl=en#:~:text=1%20Open%20the%20screen" target="_blank" style="color:#000000;">Android</a>
Gehen Sie wie folgt vor::
<a href="https://support.google.com/android/answer/9075928?hl=en#:~~:text=1%20Open%20the%20screen" target="_blank" style="color:#000000;">Android</a>
Beim manuellen Hinzufügen von HTML in der Nachricht wird derselbe Inhalt für alle Sprachversionen der E-Mail verwendet.
Die Verwendung der Selligent-Komponenten bietet die folgenden Vorteile:
-
Der Inhalt der Selligent-Komponente kann für verschiedene Sprachen erstellt werden, so dass der Text, die Schaltflächen oder Bilder in der richtigen Sprache der Nachricht angezeigt werden können. In der Quelle können Selligent-Komponenten an dem sehr spezifischen <SG>-Tag erkannt werden.
-
Es besteht ein direkter Zugriff auf die Eigenschaften und Stiloptionen der Komponente, was die Aktualisierung der Komponente vereinfacht.
Hinweis: Bei der Erstellung oder Bearbeitung von Inhalten im Quellmodus steht über die Registerkarte „Design“ ein WYSIWYG-Editor zur Verfügung, mit dem der Benutzer Änderungen an den Inhalten auf visuelle Weise vornehmen kann. Der Benutzer kann zwischen beiden Modi umschalten und dabei die änderungen behalten, die im anderen Modus vorgenommen wurden.
Warnung: Wenn die importierte HTML sehr komplex ist und benutzerdefinierte Tags enthält, kann das Umschalten zwischen Quell- und Designmodus zu Problemen führen. Es wird empfohlen, NICHT zwischen den beiden Modi zu wechseln, da einige Elemente aus dem Quellmodus nicht korrekt in den Designmodus übersetzt werden und umgekehrt. Nach dem Import ist es am besten, entweder im Quellmodus oder im Designmodus zu bleiben.
In diesem Thema:
Hinzufügen von Inhaltskomponenten zum Quellcode
Wenn Inhaltskomponenten zum Quellcode der Vorlage oder E-Mail hinzugefügt werden, wird der Quelle automatisch ein <SG>-Tag hinzugefügt.
Diese SG-Tags sind für Selligent spezifisch. Das Klicken auf ein solches Tag in der Source ermöglicht das Bearbeiten des Inhalts direkt im Eigenschaften-Bereich rechts.
Hinweis: Sie können SG-Tags auch manuell eingeben. Der Source Modus bietet eine automatische Vervollständigung:
Weitere Informationen zu den verschiedenen Arten von Komponenten finden Sie im Kapitel zu Grundlegenden Komponenten.
Ausserdem werden Text-, Schaltflächen-, Bild-, Repeater, Smart Contentblock, Video, Barcode und Contentblock-Komponenten, die zur Source hinzugefügt werden, unter den verfügbaren Komponenten rechts aufgeführt:
- Das Stift-Symbol ermöglicht die Bearbeitung der Komponente im Eigenschaften-Bereich.
- Das Augen-Symbol markiert die Komponente im Code.
- Der Papierkorb löscht die Komponente aus der Quelle.
Beispiel: Hinzufügen einer Textkomponente:
Ziehen Sie die Textkomponente in den Textkörper.
Ein Dialog zum ändern der ID der Komponente wird angezeigt. Sie können es unverändert lassen.
Wir nennen es Anrede und klicken Sie auf OK.
Ein Tag SG:content wird jetzt zur Source hinzugefügt und die Textkomponente wird im Abschnitt "Verfügbare Komponenten" aufgeführt.
Selligent-spezifische Tags
Die folgenden SG-Tags werden in der Source für jeden der Inhaltstypen erstellt, der gezogen und auf dem Quellcode abgelegt wird. Bei einem Sichtbarkeits-Constraint bei einer Komponente wird ein Attributausdruck hinzugefügt.
- Text — sg:content id='' expression='' allowhtml=''/
- Bild — sg:image id=''/
- Livecontent — <sg:livecontent id="Coupon" />
- Schaltfläche — sg:button id='' style=''/
- Teiler — sg:divider id=''/
- Video — <sg:video id=""/>
- Barcode — <sg:barcode id=""/>
- Abstandhalter — sg:spacer id=''/
- Platzhalter — sg:placeholder id=''/
- Contentblock - sg:contentblock id=''/
- Repeater -
<sg:repeater id="" structure="1" dataselection="" columns="" responsive="true" orientation="horizontal" item-mode="">
<sg:repeaterheader visible=""> </sg:repeaterheader>
<sg:repeateritem id:"" name=""> </sg:repeateritem>
<sg:repeaterfooter visible=""> </sg:repeaterfooter>
<sg:repeaterempty visible=""> </sg:repeaterempty>
</sg:repeater>
wobei die folgenden Attribute verwendet werden:
- dataselection — Name der Datenauswahl, die für diesen Repeater verwendet wird
- columns — Anzahl der Spalten im Repeater. Die Zahl kann auf 0 eingestellt werden. Als Folge werden keine zusätzliche Tabellen, TR- und TD-Tags hinzugefügt.
- responsive — Ob responsiv auf Mobilgeräten
- orientation — Wie Inhalt auf Mobilgeräten angezeigt werden soll, horizontal oder vertikal
- item-mode — Ob ein Variablenlayout für die Elementauswahl verwendet wird
- sichtbar — Wenn der Abschnitt, wie Kopf- oder Fußzeile, in der Nachricht sichtbar ist.
Hinweis: Alle Eigenschaften für die Repeater- oder Layout-Abschnitte werden zur Source hinzugefügt.
Beispiel: Die Layout-Option ist auf abwechselnd eingestellt, Sichtbarkeit auf mobil und die Anzahl der Spalten ist zwei. Die gewählte Datenauswahl wird ebenfalls zur Source hinzugefügt.
Um den Inhalt des Headers, des Elements und des Footers des Repeaters zu definieren, legen Sie einfach Text-, Schaltflächen- oder Bildkomponenten auf dem Quellcode im rechten SG-Tag ab.
- Sichtbarkeits-Constraints können durch Verwendung eines Ausdrucks in einem Attribut zu einer Inhaltskomponente (Text, Schaltfläche, Bild usw.) hinzugefügt werden.
Beispiel:
<sg:content expression="all(eq(tobool([VARIABLE.Loyal]),tobool('true')))"
> - Text nur für Kontakte sichtbar, wenn die Boolesche Variable Loyal auf true eingestellt ist.
<sg:button expression="all(ne([MASTER.TESTUSER], toint('1')))"
> - Schaltfläche nur sichtbar, wenn der Kontakt kein Testbenutzer ist.
Wenn die gesamte Zeile oder Spalte ein Sichtbarkeits-Constraint erfordert, wird ein bedingtes Tag rund um die Zeile oder Spalte mit einem Ausdruck darin erstellt.
Beispiel:
<sg:conditional id="1" expression="all(isnotempty([MASTER.NAME]))""eq(0,1)"> </sg:conditional>
Hinweis: Durch Doppelklicken auf die Tags in der Quelle wird der Eigenschaften-Bereich rechts angezeigt, der das Bearbeiten des Inhalts ermöglicht.
