Verwenden bearbeitbarer Formularfelder in Code-basierten Erlebnissen

Letzte Aktualisierung: 22. Juli 2025

Erstellt für:

  • Experte
  • Benutzende

Um sowohl die Flexibilität zu erhöhen als auch die Kontrolle über die Code-basierten Erlebnisse zu verbessern, ermöglicht Journey Optimizer Ihrem Entwicklungs-Team die Erstellung von JSON- oder HTML-Inhaltsvorlagen mit bestimmten vordefinierten bearbeitbaren Feldern.

Beim Erstellen eines Code-basierten Erlebnisses können Marketing-Experten ohne technisches Fachwissen diese Felder direkt in der Benutzeroberfläche bearbeiten, ohne den Personalisierungseditor öffnen oder andere Code-Elemente in ihrer Journey oder Kampagne bearbeiten zu müssen.

Diese Funktion bietet Marketing-Fachleuten ein vereinfachtes Erlebnis und ermöglicht Entwickelnden gleichzeitig eine bessere Kontrolle über den Code-Inhalt, was die Fehlerquellen reduziert.

Verstehen der Syntax von Formularfeldern

Damit Teile einer HTML- oder JSON-Code-Payload bearbeitbar sind, müssen Sie im Ausdruckseditor eine bestimmte Syntax verwenden. Dazu gehört die Deklarierung einer Variablen mit einem Standardwert, den Benutzende überschreiben können, nachdem sie die Inhaltsvorlage auf ihr Code-basiertes Erlebnis angewendet haben.

Angenommen, Sie möchten eine Inhaltsvorlage erstellen, die auf Ihre Code-basierten Erlebnisse angewendet werden soll, und es Benutzenden ermöglichen, eine bestimmte Farbe anzupassen, die an verschiedenen Stellen verwendet wird, z. B. die Hintergrundfarbe von Rahmen oder Schaltflächen.

Beim Erstellen der Inhaltsvorlage müssen Sie eine Variable mit einer eindeutigen ID, beispielsweise Farbe, deklarieren, und diese an den Stellen im Inhalt aufrufen, an denen diese Farbe angewendet werden soll.

Beim Anwenden der Inhaltsvorlage auf den Inhalt können Benutzende die Farbe anpassen, die dann überall dort verwendet wird, wo auf die Variable verwiesen wird.

Hinzufügen bearbeitbarer Felder zu HTML- oder JSON-Inhaltsvorlagen

Damit ein Teil Ihres JSON- oder HTML-Codes bearbeitbar ist, erstellen Sie zunächst eine Inhaltsvorlage für ein Code-basiertes Erlebnis, in der Sie bestimmte Formularfelder definieren können.

HINWEIS
Dieser Schritt wird in der Regel von einer Persona im Entwicklungsbereich ausgeführt.

➡️ In diesem Video erfahren Sie, wie Sie bearbeitbare Felder zu Vorlagen Code-basierter Erlebnisse hinzufügen

  1. Erstellen Sie eine Inhaltsvorlage und wählen Sie den Kanal Code-basiertes Erlebnis aus. Erfahren Sie, wie Sie Vorlagen erstellen.

  2. Wählen Sie den Authoring-Modus aus: HTML oder JSON.

    VORSICHT
    Das Ändern des Authoring-Modus führt zum Verlust des gesamten aktuellen Codes. Die auf dieser Vorlage basierenden Code-basierten Erlebnisse müssen denselben Authoring-Modus verwenden.

  3. Öffnen Sie den Personalisierungseditor, um Ihren Code-Inhalt zu bearbeiten.

  4. Um ein bearbeitbares Formularfeld zu definieren, navigieren Sie zum Menü Hilfsfunktionen im linken Navigationsbereich und fügen Sie das Attribut inline hinzu. Die Syntax zum Deklarieren und Aufrufen der Variablen wird Ihrem Inhalt automatisch hinzugefügt.

  5. Ersetzen Sie "name" durch eine eindeutige ID, um das bearbeitbare Feld zu identifizieren. Geben Sie beispielsweise „imgURL“ ein.

    HINWEIS
    Die Feld-ID muss eindeutig sein und darf keine Leerzeichen enthalten. Diese ID sollte überall dort in Ihrem Inhalt verwendet werden, wo der Wert der Variablen angezeigt werden soll.

  6. Passen Sie die Syntax an Ihre Anforderungen an, indem Sie die in der folgenden Tabelle aufgeführten Parameter hinzufügen:

    Aktion
    Parameter
    Beispiel
    Deklarieren eines bearbeitbaren Felds mit einem Standardwert. Wenn Sie die Vorlage zu Ihrem Inhalt hinzufügen, wird dieser Standardwert verwendet, sofern Sie keine Anpassung vornehmen.
    Hinzufügen des Standardwerts zwischen den Inline-Tags.
    {{#inline "editableFieldID"}}default_value{{/inline}}
    Definieren eines Labels für das bearbeitbare Feld. Dieses Label wird beim Bearbeiten von Vorlagenfeldern im Code-Editor angezeigt.
    name="title"
    {{#inline "editableFieldID" name="title"}}default_value{{/inline}}

  7. Klicken Sie auf Vorschau der Formularfelder anzeigen, um zu überprüfen, wie die bearbeitbaren Formularfelder in den Code-basierten Erlebnissen angezeigt werden, die diese Vorlage anwenden.

  8. Verwenden Sie die Syntax {{{name}}} in Ihrem Code überall dort, wo der Wert des bearbeitbaren Felds angezeigt werden soll. Ersetzen Sie name durch die eindeutige ID des zuvor definierten Felds.

  9. Gehen Sie ähnlich vor, um weitere bearbeitbare Felder hinzuzufügen, und umschließen Sie sie jeweils mit den Tags {{#inline}} und {{/inline}}.

  10. Bearbeiten Sie den Rest Ihres Codes nach Bedarf, einschließlich der IDs, die den von Ihnen definierten bearbeitbaren Feldern entsprechen. Weitere Informationen

  11. Speichern Sie Ihre Vorlage.

Verwenden von Entscheidungsrichtlinien in bearbeitbaren Feldformularen

Beim Erstellen einer Inhaltsvorlage für Code-basierte Erlebnisse können Sie eine Entscheidungsrichtlinie verwenden, um Angebote in Ihren bearbeitbaren Formularfeldern zu nutzen.

  1. Erstellen Sie eine Vorlage für Code-basierte Erlebnisse wie oben beschrieben.

  2. Klicken Sie auf Entscheidungsrichtlinie hinzufügen entweder über das Symbol Entscheidungsfindung anzeigen in der rechten Leiste des Bearbeitungsbildschirms oder im Abschnitt Entscheidungsrichtlinie im linken Menü im Ausdruckseditor.

    In diesem Abschnitt erfahren Sie, wie Sie eine Entscheidungsrichtlinie erstellen.

  3. Klicken Sie auf die Schaltfläche Richtlinie einfügen. Der Code, der der Entscheidungsrichtlinie entspricht, wird hinzugefügt.

  4. Fügen Sie nach dem {{#each}}-Tag den Code ein, der den bearbeitbaren Formularfeldern entspricht, die Sie hinzufügen möchten, und verwenden Sie dabei die oben beschriebene Inline-Syntax. Ersetzen Sie "name" durch eine eindeutige ID, um das bearbeitbare Feld zu identifizieren. Verwenden Sie in diesem Beispiel „title“.

  5. Klicken Sie auf Vorschau der Formularfelder anzeigen, um zu überprüfen, wie die bearbeitbaren Formularfelder in den Code-basierten Erlebnissen angezeigt werden, die diese Vorlage anwenden.

  6. Fügen Sie den Rest Ihres Codes über dem {{/each}}-Tag ein. Verwenden Sie die {{{name}}}-Syntax in Ihrem Code überall dort, wo der Wert des bearbeitbaren Felds angezeigt werden soll. Ersetzen Sie in diesem Beispiel name durch „title“.

  7. Speichern Sie Ihre Vorlage.