In diesem Beispiel personalisieren Sie den Textkörper einer E-Mail-Nachricht. Diese Nachricht richtet sich an Kunden, die zwar Artikel in ihren Einkaufswagen abgelegt, aber ihren Einkauf nicht abgeschlossen haben.
Sie werden die folgenden Arten von Hilfsfunktionen verwenden:
upperCase
, mit der der Vorname des Kunden in Großbuchstaben eingefügt wird. Weitere Informationen.each
, um die Artikel im Warenkorb aufzulisten. Weitere Informationen.if
, um eine produktspezifische Anmerkung einzufügen, wenn sich das zugehörige Produkt im Warenkorb befindet. Weitere Informationen.➡️ Im Video erfahren Sie, wie Sie Helper-Funktionen verwenden
Bevor Sie beginnen, sollten Sie wissen, wie Sie diese Elemente konfigurieren:
Führen Sie folgende Schritte aus:
Erstellen oder ändern Sie eine E-Mail-Nachricht und klicken Sie dann auf Email Designer.
Ziehen Sie drei Strukturkomponenten aus der linken Palette der Startseite von Email Designer in den Textkörper der Nachricht.
Ziehen Sie eine HTML-Inhaltskomponente per Drag-and-Drop auf jede neue Strukturkomponente.
Klicken Sie auf der Startseite von Email Designer auf die HTML-Komponente, der Sie den Vornamen des Kunden hinzufügen möchten.
Klicken Sie in der kontextbezogenen Symbolleiste auf Quellcode anzeigen.
Fügen Sie im Fenster HTML bearbeiten die Zeichenfolgen-Funktionen upperCase
hinzu:
Wählen Sie im linken Menü die Option Hilfsfunktionen.
Verwenden Sie das Suchfeld, um „Großbuchstaben“ zu finden.
Fügen Sie die Funktion upperCase
aus den Suchergebnissen hinzu. Klicken Sie dazu auf das Pluszeichen (+) neben {%= upperCase(string) %}: string
.
Der Ausdruckseditor zeigt diesen Ausdruck:
{%= upperCase(string) %}
Entfernen Sie den Platzhalter „string“ (Zeichenfolge) aus dem Ausdruck.
Fügen Sie das Vorname-Token hinzu:
Wählen Sie im linken Menü die Option Profilattribute.
Wählen Sie Person > Vollständiger Name.
Fügen Sie dem Ausdruck das Token Vorname hinzu.
Der Ausdruckseditor zeigt diesen Ausdruck:
{%= upperCase(profile.person.name.firstName) %}
Weitere Informationen zum Datentyp des Personennamens finden Sie in der Dokumentation zu Adobe Experience Platform.
Klicken Sie auf Validieren und dann auf Speichern.
Speichern Sie die Nachricht.
Der Warenkorbinhalt ist kontextbezogene Information aus der Journey. Daher müssen Sie einer Journey ein Anfangsereignis und die E-Mail hinzufügen, bevor Sie der E-Mail Warenkorb-spezifische Informationen hinzufügen können.
Erstellen Sie ein Ereignis, dessen Schema das Array productListItems
enthält.
Definieren Sie alle Felder aus diesem Array als Payload-Felder für dieses Ereignis.
Weitere Informationen zum Datentyp des Produktlistenelements finden Sie in der Dokumentation zu Adobe Experience Platform.
Erstellen Sie eine Journey, die mit diesem Ereignis beginnt.
Fügen Sie der Journey die Nachricht hinzu.
Beenden Sie die Journey mit einer Ende-Aktivität.
Da Sie die Nachricht noch nicht veröffentlicht haben, können Sie die Journey weder testen noch veröffentlichen.
Klicken Sie auf OK.
Eine Meldung informiert Sie darüber, dass der Journey-Kontext an die Nachricht weiteregegeben wurde.
Öffnen Sie die Nachricht erneut.
Klicken Sie auf der Startseite von Email Designer auf die HTML-Komponente, in der Sie den Inhalt des Warenkorbs auflisten möchten.
Klicken Sie in der kontextbezogenen Symbolleiste auf Quellcode anzeigen.
Fügen Sie im Fenster HTML bearbeiten den Helper each
hinzu:
Wählen Sie im linken Menü die Option Hilfsfunktionen.
Verwenden Sie das Suchfeld, um „each“ zu finden.
Fügen Sie von den Suchergebnissen den Helper each
hinzu.
Der Ausdruckseditor zeigt diesen Ausdruck:
{{#each someArray as |variable|}} {{/each}}
Fügen Sie dem Ausdruck das Array productListItems
hinzu:
Entfernen Sie den Platzhalter „someArray“ aus dem Ausdruck.
Wählen Sie im linken Menü die Option Kontextattribute.
Kontextattribute sind erst verfügbar, nachdem der Journey-Kontext an die Nachricht übergeben wurde.
Wählen Sie Journey Optimizer > Ereignisse > event_name aus und erweitern Sie dann den Knoten productListItems.
In diesem Beispiel steht event_name für den Namen Ihres Ereignisses.
Fügen Sie dem Ausdruck das Token Produkt hinzu.
Der Ausdruckseditor zeigt diesen Ausdruck:
{{#each context.journey.events.event_ID.productListItems.product as |variable|}} {{/each}}
In diesem Beispiel steht event_ID für die Kennung Ihres Ereignisses.
Ändern Sie den Ausdruck:
Dieses Beispiel zeigt den geänderten Ausdruck:
{{#each context.journey.events.event_ID.productListItems as |product|}}
Fügen Sie diesen Code zwischen dem öffnenden {{#each}}
-Tag und dem schließenden {/each}}
-Tag ein:
<table>
<tbody>
<tr>
<td><b>#name</b></td>
<td><b>#quantity</b></td>
<td><b>$#priceTotal</b></td>
</tr>
</tbody>
</table>
Fügen Sie die Personalisierungs-Token für den Artikelnamen, die Menge und den Preis hinzu:
Wiederholen Sie diese Schritte zweimal:
Dieses Beispiel zeigt den geänderten Ausdruck:
{{#each context.journey.events.event_ID.productListItems as |product|}}
<table>
<tbody>
<tr>
<td><b>{{context.journey.events.event_ID.productListItems.name}}</b></td>
<td><b>{{context.journey.events.event_ID.productListItems.quantity}}</b></td>
<td><b>${{context.journey.events.event_ID.productListItems.priceTotal}}</b></td>
</tr>
</tbody>
</table>
{{/each}}
Klicken Sie auf Validieren und dann auf Speichern.
Klicken Sie auf der Startseite von Email Designer auf die HTML-Komponente, in der Sie die Anmerkung einfügen möchten.
Klicken Sie in der kontextbezogenen Symbolleiste auf Quellcode anzeigen.
Fügen Sie im Fenster HTML bearbeiten den Helper if
hinzu:
Wählen Sie im linken Menü die Option Hilfsfunktionen.
Verwenden Sie das Suchfeld, um „if“ zu finden.
Fügen Sie von den Suchergebnissen den Helper if
hinzu.
Der Ausdruckseditor zeigt diesen Ausdruck:
{%#if condition1%} render_1
{%else if condition2%} render_2
{%else%} default_render
{%/if%}
Entfernen Sie diese Bedingung aus dem Ausdruck:
{%else if condition2%} render_2
Dieses Beispiel zeigt den geänderten Ausdruck:
{%#if condition1%} render_1
{%else%} default_render
{%/if%}
Fügen Sie der Bedingung das Produktname-Token hinzu:
Entfernen Sie den Platzhalter „condition1“ aus dem Ausdruck.
Wählen Sie im linken Menü die Option Kontextattribute.
Wählen Sie Journey Orchestration > Ereignisse > event_name aus und erweitern Sie dann den Knoten productListItems.
In diesem Beispiel steht event_name für den Namen Ihres Ereignisses.
Fügen Sie dem Ausdruck das Token Name hinzu.
Der Ausdruckseditor zeigt diesen Ausdruck:
{%#if context.journey.events.`event_ID`.productListItems.name%}
render_1
{%else%} default_render
{%/if%}
Ändern Sie den Ausdruck:
Geben Sie im Ausdruckseditor den Produktnamen nach dem Token name
an.
Verwenden Sie diese Syntax, wobei product_name den Namen Ihres Produkts darstellt:
= "product_name"
In diesem Beispiel lautet der Produktname „Juno Jacket“:
{%#if context.journey.events.`event_ID`.productListItems.name = "Juno Jacket" %}
render_1
{%else%} default_render
{%/if%}
Ersetzen Sie den Platzhalter „render_1“ durch den Text der Anmerkung.
Beispiel:
{%#if context.journey.events.`event_ID`.productListItems.name = "Juno Jacket" %}
Due to longer than usual lead times on the Juno Jacket, please expect item to ship two weeks after purchase.
{%else%} default_render
{%/if%}
Entfernen Sie den Platzhalter „default_render“ aus dem Ausdruck.
Klicken Sie auf Validieren und dann auf Speichern.
Speichern und veröffentlichen Sie die Nachricht.
Öffnen Sie die Journey. Wenn die Journey bereits geöffnet ist, müssen Sie die Seite aktualisieren.
Aktivieren Sie den Umschalter Test und klicken Sie dann auf Ereignis auslösen.
Sie können den Testmodus erst aktivieren, nachdem Sie die Nachricht veröffentlicht haben.
Geben Sie im Fenster Ereigniskonfiguration die Eingabewerte ein und klicken Sie dann auf Senden.
Der Testmodus funktioniert nur mit Testprofilen.
Die E-Mail wird an die Adresse des Testprofils gesendet.
In diesem Beispiel enthält die E-Mail die Anmerkung zur Jacke Juno (Juno Jacket), da sich dieses Produkt im Warenkorb befindet:
Vergewissern Sie sich, dass kein Fehler vorliegt, und veröffentlichen Sie die Journey.
Erfahren Sie, wie Sie Hilfsfunktionen verwenden.