Anpassbare Fragmente customizable-fragments

Wenn Fragmente in einer E-Mail oder E-Mail-Vorlage verwendet werden, sind sie aufgrund der Vererbung standardmäßig gesperrt, d. h. alle Änderungen, die an einem Fragment vorgenommen werden, werden automatisch an alle Assets weitergegeben, in denen es verwendet wird. Mit anpassbaren Fragmenten können bestimmte Felder innerhalb eines Fragments als bearbeitbar definiert werden, wenn das Fragment zu einer E-Mail oder E-Mail-Vorlage hinzugefügt wird. Wenn Sie beispielsweise über ein Fragment mit einem Banner, etwas Text und einer Schaltfläche verfügen, können Sie bestimmte Felder, z. B. die Bild- oder Schaltflächen-Ziel-URL, als bearbeitbar festlegen.

Mit anpassbaren Fragmenten können Sie Inhalte verwalten und personalisieren, ohne völlig neue Inhaltsbausteine zu erstellen oder die Fragmentvererbung zu unterbrechen. Änderungen, die auf Fragmentebene vorgenommen werden, werden weiterhin weitergegeben und ermöglichen die Anpassung auf E-Mail- oder E-Mail-Vorlagenebene.

Sowohl visuelle Fragmente als auch Ausdrucksfragmente können als anpassbar markiert werden.

Hinzufügen bearbeitbarer Felder in visuellen Fragmenten visual

Gehen Sie wie folgt vor, um Teile eines visuellen Fragments als bearbeitbar festzulegen:

Nachdem Sie das Fragment zu einer E-Mail hinzugefügt haben, können Benutzer alle bearbeitbaren Felder anpassen, die im Fragment konfiguriert sind.

Bearbeitbare HTML-Komponenten in Fragmenten editable-html

Innerhalb einer HTML-Komponente können die folgenden Elementtypen bearbeitbar gemacht werden:

Jeder parametrisierte CSS-Eigenschaftswert muss genau {{{varName}}} sein: keine Suffixe, kein zusätzlicher Text, keine mehreren Variablen und keine Verkettung innerhalb einer einzelnen Eigenschaft.

Um mehrseitige Eigenschaften wie den Abstand zu parametrisieren, gehen Sie wie folgt vor:

Funktionsweise von bearbeitbaren Feldern in HTML-Komponenten components

Bearbeitbare Felder in einer HTML-Komponente werden erstellt, indem Inline-Variablen direkt im Quellcode der Komponente deklariert werden. Jede Variable hat eine eindeutige ID und einen Standardwert. Die Variable wird dann dort referenziert, wo der bearbeitbare Wert im Markup angezeigt werden soll.

Nach dem Speichern und Veröffentlichen des Fragments wird jede in der HTML-Komponente deklarierte Variable automatisch als bearbeitbarer Parameter angezeigt, wenn das Fragment zu einer E-Mail hinzugefügt wird.

Der E-Mail-Autor kann dann den Standardwert einer beliebigen Variablen aus der E-Mail-Designer überschreiben (z. B. eine Hintergrundfarbe ändern, eine CTA-URL austauschen oder eine Überschrift aktualisieren), ohne die zugrunde liegende HTML zu ändern.

Syntaxverweis syntax

Bearbeitbare Felder werden anhand von zwei Mustern definiert und referenziert:

Deklarieren einer Variablen declaring

Verwenden Sie die Inline-Deklaration, um eine Variable mit einer eindeutigen ID und einem Standardwert zu definieren:

{{#inline "variableID"}}default_value{{/inline}}

Ersetzen Sie variableID durch eine eindeutige Kennung für das bearbeitbare Feld. Die ID muss innerhalb der Komponente eindeutig sein und darf keine Leerzeichen enthalten.

Ersetzen Sie default_value durch den Wert, der verwendet werden soll, wenn der E-Mail-Autor ihn nicht überschreibt.

Verweisen auf eine Variable referencing

Verwenden Sie dreifache geschweifte Klammern, um auf die Variable an der Stelle zu verweisen, an der ihr Wert im Markup angezeigt werden soll:

{{{variableID}}}

Dieselbe Variablenkennung kann innerhalb der HTML beliebig oft referenziert werden. Alle Verweise werden auf den Wert aufgelöst, den der E-Mail-Autor festlegt (oder auf den Standardwert, wenn keine Überschreibung bereitgestellt wird).

Optionale Parameter optional

Die Inline-Deklaration unterstützt optionale Parameter, die die Darstellung oder Verarbeitung des bearbeitbaren Felds ändern:

Hinzufügen bearbeitbarer Felder zu einer HTML-Komponente adding-editable-fields

Gehen Sie wie folgt vor, um Teile einer HTML-Komponente in einem visuellen Fragment bearbeitbar zu machen:

Fragment in einer E-Mail verwenden using-fragment

Nachdem das Fragment veröffentlicht wurde, werden alle in den HTML-Komponenten deklarierten Variablen als bearbeitbare Parameter in der E-Mail-Designer angezeigt.

So passen Sie sie bei Verwendung des Fragments in einer E-Mail an:

Das Fragment wird mit den angepassten Werten gerendert, während weiterhin alle zukünftigen strukturellen Aktualisierungen am veröffentlichten Fragment übernommen werden.

Beispiel: einfaches Fragment mit bearbeitbarem Text, Farbe und URL example

Im folgenden Beispiel wird ein kleines Werbebanner mit vier bearbeitbaren Feldern erstellt:

Nach der Veröffentlichung des Fragments kann ein E-Mail-Autor diese Werte überschreiben, wenn er das Fragment zu einer E-Mail hinzufügt.

Einfaches bearbeitbares Banner

<!-- Define editable variables -->
{{#inline "bgColor"}}#0057FF{{/inline}}
{{#inline "headlineText"}}Example Headline{{/inline}}
{{#inline "ctaText"}}Learn More{{/inline}}
{{#inline "ctaUrl" assetType="url"}}https://www.example.com{{/inline}}

<!-- Use the variables in the HTML -->
<table width="100%" cellpadding="0" cellspacing="0"
       style="background-color:{{{bgColor}}}; border-radius:8px;" >
  <tr>
    <td style="padding:30px; text-align:center; font-family:Arial,sans-serif;">
      <h2 style="color:#ffffff; font-size:24px; margin:0;">
        {{{headlineText}}}
      </h2>
      <a href="{{{ctaUrl}}}"
         style="display:inline-block; margin-top:16px; padding:12px 28px;
                background:#ffffff; color:{{{bgColor}}};
                font-weight:bold; border-radius:4px; text-decoration:none;">
        {{{ctaText}}}
      </a>
    </td>
  </tr>
</table>

In diesem Beispiel:

Best Practices best-practices

Was Sie wissen sollten things-to-know