Frammenti personalizzabili customizable-fragments

Quando i frammenti vengono utilizzati in un’e-mail o in un modello e-mail, vengono bloccati per impostazione predefinita a causa dell’ereditarietà, il che significa che eventuali modifiche apportate a un frammento vengono propagate automaticamente a tutte le risorse in cui viene utilizzato. Con i frammenti personalizzabili, campi specifici all’interno di un frammento possono essere definiti come modificabili quando il frammento viene aggiunto a un’e-mail o a un modello e-mail. Ad esempio, se disponi di un frammento con un banner, del testo e un pulsante, puoi designare come modificabili alcuni campi, ad esempio l’URL di destinazione dell’immagine o del pulsante.

I frammenti personalizzabili consentono di gestire e personalizzare il contenuto senza creare blocchi di contenuto completamente nuovi o interrompere l’ereditarietà dei frammenti. Le modifiche apportate a livello di frammento vengono comunque propagate, consentendo al contempo la personalizzazione a livello di e-mail o modello e-mail.

I frammenti visivi e di espressione possono essere contrassegnati come personalizzabili.

Aggiungere campi modificabili nei frammenti visivi visual

Per rendere modificabili parti di un frammento visivo, effettua le seguenti operazioni:

Dopo aver aggiunto il frammento a un messaggio e-mail, gli utenti possono personalizzare tutti i campi modificabili configurati nel frammento.

Componenti HTML modificabili nei frammenti editable-html

All’interno di un componente HTML, è possibile modificare i seguenti tipi di elementi:

Ogni valore della proprietà CSS con parametri deve essere esattamente {{{varName}}}: nessun suffisso, nessun testo aggiuntivo, nessuna variabile multipla e nessuna concatenazione all’interno di una singola proprietà.

Per parametrizzare proprietà multilaterali come la spaziatura interna:

Funzionamento dei campi modificabili nei componenti di HTML components

I campi modificabili in un componente HTML vengono creati dichiarando le variabili in linea direttamente all’interno del codice sorgente del componente. Ogni variabile ha un ID univoco e un valore predefinito. Viene quindi fatto riferimento alla variabile ogni volta che il valore modificabile deve essere visualizzato nel markup.

Una volta salvato e pubblicato il frammento, ogni variabile dichiarata nel componente HTML viene automaticamente visualizzata come parametro modificabile quando il frammento viene aggiunto a un messaggio e-mail.

L’autore dell’e-mail può quindi sovrascrivere il valore predefinito di qualsiasi variabile di E-mail Designer (ad esempio, modificando un colore di sfondo, scambiando un URL CTA o aggiornando un titolo) senza modificare il HTML sottostante.

Riferimento sintassi syntax

I campi modificabili sono definiti e referenziati utilizzando due pattern:

Dichiarazione di una variabile declaring

Utilizza la dichiarazione in linea per definire una variabile con un ID univoco e un valore predefinito:

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

Sostituire variableID con un identificatore univoco per il campo modificabile. L’ID deve essere univoco all’interno del componente e non deve contenere spazi.

Sostituire default_value con il valore che deve essere utilizzato se l’autore e-mail non lo sostituisce.

Riferimento a una variabile referencing

Utilizza parentesi graffe triple per fare riferimento alla variabile ovunque il relativo valore dovrebbe apparire nel markup:

{{{variableID}}}

È possibile fare riferimento allo stesso ID variabile un numero qualsiasi di volte all’interno di HTML. Tutti i riferimenti verranno risolti in base al valore impostato dall’autore dell’e-mail (o al valore predefinito, se non viene fornita alcuna sostituzione).

Parametri opzionali optional

La dichiarazione in linea supporta parametri facoltativi che modificano la modalità di presentazione o elaborazione del campo modificabile:

Aggiunta di campi modificabili a un componente HTML adding-editable-fields

Per rendere modificabili parti di un componente HTML all’interno di un frammento visivo, effettua le seguenti operazioni:

Utilizzo del frammento in un messaggio e-mail using-fragment

Dopo la pubblicazione del frammento, tutte le variabili dichiarate nei suoi componenti HTML vengono visualizzate come parametri modificabili in E-mail Designer.

Per personalizzarli quando si utilizza il frammento in un messaggio e-mail:

Il frammento viene riprodotto con i valori personalizzati, ereditando comunque eventuali aggiornamenti strutturali futuri apportati al frammento pubblicato.

Esempio: frammento semplice con testo, colore e URL modificabili example

L’esempio seguente crea un piccolo banner promozionale con quattro campi modificabili:

Dopo aver pubblicato il frammento, un autore e-mail può ignorare uno di questi valori quando aggiunge il frammento a un messaggio e-mail.

Banner semplice e modificabile

<!-- 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 questo esempio:

Best practice best-practices

Aspetti da considerare things-to-know