Sintassi del modello e-mail email-template-syntax
Nella nuova esperienza E-mail 2.0 di Marketo, i modelli e-mail sono composti da qualsiasi combinazione di elementi, variabili, moduli o contenitori. Ciascuno viene definito aggiungendo una sintassi specifica di Marketo al HTML. I precedenti modelli di e-mail (v1.0) sono supportati in Editor e-mail 2.0; tuttavia, non includeranno tutte le funzioni del nuovo editor.
La sintassi delle e-mail di Marketo funziona solo nei modelli e nelle singole e-mail; funziona non funziona se incorporata in snippet o token Rich Text.
Elementi elements
Gli elementi sono aree di contenuto che puoi definire modificabili nel modello e-mail. L’esperienza di modifica di un elemento è unica per il suo tipo e offre un modo semplice di lavorare con il contenuto. I possibili elementi che possono essere inclusi in un modello e-mail sono:
- Rich Text
- Immagini
- Snippet
- Video
Rich Text rich-text
Se si definisce un'area come Testo formattato, gli utenti potranno modificarne il contenuto utilizzo dell’editor Rich Text di Marketo. Esistono due modi per definire un elemento Rich Text all’interno di un modello e-mail: mktEditable e mktoText. Nota: un elemento Rich Text può sempre essere convertito in uno snippet dall’interno dell’editor e-mail.
Opzione 1 - Modificabile option-mkteditable
Poiché Email Editor 2.0 è compatibile con le versioni precedenti, alcuni vecchi modelli di e-mail possono specificare elementi in formato Rich Text aggiungendo class="mktEditable" a qualsiasi elemento HTML. Questo è ancora supportato e l’ID dell’elemento sarà utilizzato come nome visualizzato all’interno dell’editor e-mail.
Attributi richiesti
- classe: "mktEditable".
- id: stringa ID. Contiene solo lettere, numeri, trattini "-" e trattini bassi "_". Non sono consentiti spazi. Deve essere univoco.
Attributi facoltativi
- mktoName : stringa. Questo è il nome visualizzato in Email Editor 2.0. Si consiglia di utilizzare un nome descrittivo.
Valore predefinito
Il contenuto all’interno dell’elemento HTML (se fornito) con class="mktEditable" verrà utilizzato come valore predefinito per l’elemento Rich Text.
Esempio:
<pre data-theme="Confluence"><div class="mktEditable" id="exampleText" mktoName="Main Body Text"> Optionally add default text for the editable text area. </div></pre>
Opzione 2: mktoText option-mktotext
Si consiglia di specificare gli elementi Rich Text utilizzando la sintassi class="mktoText". In questo modo viene sempre fornito un nome visualizzato corretto per l’elemento.
Attributi richiesti
- classe: "mktoText"
- id: stringa ID. Contiene solo lettere, numeri, trattini "-" e trattini bassi "_". Non sono consentiti spazi. Deve essere univoco.
- mktoName : stringa. Questo è il nome visualizzato in Email Editor 2.0. Si consiglia di utilizzare un nome descrittivo.
Valore predefinito
Il contenuto all’interno dell’elemento HTML (se fornito) con class="mktoText" verrà utilizzato come valore predefinito per l’elemento Rich Text.
Esempio:
<pre data-theme="Confluence"><div class="mktoText" id="exampleText" mktoName="Main Body Text"> Optionally add default text for the editable text area. </div></pre>
Immagini images
Sono disponibili due opzioni per definire gli elementi immagine modificabili. È possibile utilizzare una delle seguenti opzioni <div>, che specifica un contenitore in cui <img> verrà inserito in, o un <img> tag. Se desideri che l’utente finale selezioni semplicemente un’immagine che restituirà l’URL dell’immagine (anziché il DOM), consulta "variabili immagine" nella sezione seguente. Le due opzioni seguenti inseriranno un HTML <img> elemento.
Opzione 1 - Utilizzare un <div> option-use-a-div
Attributi richiesti
- classe: "mktoImg"
- id: Stringa ID. Contiene solo lettere, numeri, trattini "-" e trattini bassi "_". Non sono consentiti spazi. Deve essere univoco.
- mktoName: Stringa. Questo è il nome visualizzato in Email Editor 2.0. Si consiglia di utilizzare un nome descrittivo.
Attributi facoltativi
- mktoImgClass: Stringa. Il valore qui verrà aggiunto all’attributo class del
<img>all'interno del div. - mktoImgSrc: Da utilizzare come valore predefinito per l'immagine inserita in questo div. Se viene omesso, viene utilizzato un segnaposto.
- mktoImgLink: Indicare che
<img>deve essere circondato da un<a>con questo URL di destinazione. L’utente può modificarlo nell’Editor e-mail. - mktoImgLinkTarget: Indicare che
<a>dall'attributo mktoImgLink deve utilizzare questa destinazione. Non produce alcun effetto se non si utilizza anche mktoImgLink. - mktoImgWidth: Utilizzato come larghezza sul racchiuso
<img>. - mktoImgHeight: Utilizzato come altezza sul racchiuso
<img>. - mktoLockImgSize: Utilizzato per sbloccare il
<img>proprietà height e width dell'elemento in modo che l'utente finale possa modificare il valore (se omesso, il valore predefinito è true). - mktoLockImgStyle: Utilizzato per bloccare
<img>proprietà style dell'elemento (il valore predefinito è false).
Valore predefinito (facoltativo)
<img>: da utilizzare come <img> l'elemento in cui verrà inserita l'immagine. Utile se desideri aggiungere all’immagine uno stile in linea. Ricorda di includere circostante <a> </a> , in modo che, se l’utente aggiunge un collegamento, il tuo stile non venga rimosso.
Esempio:
<pre data-theme="Confluence"><div class="mktoImg" id="exampleImg" mktoName="Example Image" mktoImgLink="https://www.marketo.com"> <a><img style="border:10px solid red;"></a> </div></pre>
Opzione 2 - Utilizzare un <img> option-use-an-img
Attributi richiesti
- classe: "mktoImg"
- id: Stringa ID. Contiene solo lettere, numeri, trattini "-" e trattini bassi "_". Non sono consentiti spazi. Deve essere univoco.
- mktoName: Stringa. Questo è il nome visualizzato in Email Editor 2.0. Si consiglia di utilizzare un nome descrittivo. Valore predefinito (facoltativo)
- src: Da utilizzare come valore predefinito per l'immagine. Se viene omesso, viene utilizzato un segnaposto.
- mktoLockImgSize: Utilizzato per sbloccare il
<img>proprietà height e width dell'elemento in modo che l'utente finale possa modificare il valore (se omesso, il valore predefinito è true). - mktoLockImgStyle: Utilizzato per bloccare
<img>proprietà style dell'elemento (il valore predefinito è false).
Esempio:<pre data-theme="Confluence"><img class="mktoImg" id="exampleImg" mktoName="Example Image"></pre>
Snippet snippets
Se si definisce un'area come frammento, gli utenti finali potranno scegliere quale approvato Frammentosi desidera inserire in questa area. Sebbene gli elementi Rich Text possano essere convertiti in snippet dall’editor e-mail, quando definisci un’area specifica come Snippet non può essere convertita in Rich Text. È possibile specificare un'area Snippet utilizzando una <div> con class="mktoSnippet"
Attributi richiesti
- id: Stringa ID. Contiene solo lettere, numeri, trattini "-" e trattini bassi "_". Non sono consentiti spazi. Deve essere univoco.
- mktoName: Stringa. Questo è il nome visualizzato in Email Editor 2.0. Si consiglia di utilizzare un nome descrittivo.
Valore predefinito (facoltativo)
mktoDefaultSnippetId: ID numerico dello snippet di Marketo che deve essere visualizzato per impostazione predefinita (funziona solo se uno snippet con tale ID esiste ed è approvato in tale area di lavoro).
Esempio:
<pre data-theme="Confluence"><div class="mktoSnippet" id="unsubscribeFooter" mktoName="Unsubscribe Footer" mktoDefaultSnippetId="12"></div></pre>
Video video
Se definisci un’area geografica come video, gli utenti finali potranno inserire un URL YouTube o Vimeo da visualizzare come immagine in miniatura (con il pulsante "play") all’interno dell’e-mail. È possibile specificare un'area Video utilizzando una <div> con class="mktoVideo"
Attributi richiesti
- id: Stringa ID. Contiene solo lettere, numeri, trattini "-" e trattini bassi "_". Non sono consentiti spazi. Deve essere univoco.
- mktoName: Stringa. Questo è il nome visualizzato in Email Editor 2.0. Si consiglia di utilizzare un nome descrittivo.
Attributi facoltativi
- mktoImgClass: Stringa. Il valore qui verrà aggiunto all’attributo class della miniatura video
<img>all'interno del div.
Esempio:
<pre data-theme="Confluence"><div class="mktoVideo" id="productVideo" mktoName="Product Announcement Video"></div></pre>
Variabili variables
Le variabili sono simili ai token. Puoi prima definirli all’interno del <head> sezione del modello e-mail tramite <meta> e utilizzarli tutte le volte che si desidera in tutto il modello. Poiché sono definiti nel modello, l’utente finale sarà in grado di modificare i propri valori in base alle proprie regole. Tieni presente che puoi definire una variabile come locale o globale nell’ambito. Se utilizzi una variabile all’interno di un "modulo" (vedi sotto) e un utente finale duplica tale modulo, le variabili locali avranno valori indipendenti, mentre le variabili globali saranno applicabili a entrambi i moduli.
Stringa string
Se specifichi una variabile come stringa, l’utente finale potrà immettere il testo all’interno di una casella di testo nell’editor e-mail. È possibile specificare una variabile String utilizzando <meta> con class="mktoString"
Attributi richiesti
- id: Come fare riferimento alla variabile all’interno del modello e-mail.
- mktoName: Stringa. Questo è il nome visualizzato in Email Editor 2.0. Si consiglia di utilizzare un nome descrittivo.
Attributi facoltativi
- allowHTML: Booleano. Controlla se il valore della variabile è con escape per HTML. Se omesso, il valore predefinito è False.
- predefinito: valore predefinito per la stringa. Vuoto se omesso.
- mktoModuleScope: booleano. Controlla se la variabile è locale (true) o globale (false) quando viene utilizzata in un modulo. Se omesso, il valore predefinito è False.
Esempio di dichiarazione:
<pre data-theme="Confluence"><meta class="mktoString" id="textHeader" mktoName="Text Header" default="Edit Me"></pre>
Esempio di utilizzo:
<pre data-theme="Confluence">${textHeader}</pre>
Elenco list
Se specifichi una variabile come Elenco, l’utente finale potrà scegliere da un set di valori definito nell’editor e-mail. È possibile specificare una variabile elenco utilizzando <meta> con class="mktoList"
Attributi richiesti
- id: come fai riferimento alla variabile all’interno del modello e-mail.
- mktoName: Stringa. Questo è il nome visualizzato in Email Editor 2.0. Si consiglia di utilizzare un nome descrittivo.
- valori: Elenco di valori separato da virgole. Deve essere presente almeno una stringa.
Attributi facoltativi
- impostazione predefinita: Valore predefinito del menu a discesa di selezione. Se omesso, viene utilizzato il primo valore dell’attributo "values".
- mktoModuleScope: booleano. Controlla se la variabile è locale (true) o globale (false) quando viene utilizzata in un modulo. Se omesso, il valore predefinito è False.
Esempio di dichiarazione:
<pre data-theme="Confluence"><meta class="mktoList" id="textFontFamily" mktoName="Main Text Font Family" values="Arial,Verdana,Times New Roman"></pre>
Esempio di utilizzo:
<pre data-theme="Confluence">${textFontFamily}</pre>
Numero number
Se specifichi una variabile come Numero, l’utente finale potrà immettere un numero nell’editor e-mail. È possibile specificare una variabile Numerica utilizzando <meta> con class="mktoNumber"
Attributi richiesti
- id: come fai riferimento alla variabile all’interno del modello e-mail.
- mktoName: stringa. Questo è il nome visualizzato in Email Editor 2.0. Si consiglia di utilizzare un nome descrittivo.
- impostazione predefinita: Valore numerico predefinito per la variabile.
Attributi facoltativi
- min.: Valore minimo accettato.
- max: Valore massimo accettato.
- unità: Unità da aggiungere al valore numerico (es: px, pt, em, ecc.) quando viene visualizzato nell’Editor e-mail e nel codice risultante.
- passaggio: Quante unità la variabile numerica deve aumentare/diminuire di (0,1, 1, 10, ecc.). Se omesso, il valore predefinito è 1.
- mktoModuleScope: booleano. Controlla se la variabile è locale (true) o globale (false) quando viene utilizzata in un modulo. Se omesso, il valore predefinito è False.
Esempio di dichiarazione:
<pre data-theme="Confluence"><meta class="mktoNumber" id="textFontSize" mktoName="Main Text Font Size" default="12" min="8" max="18" units="px" step="1"> </pre>
Esempio di utilizzo:
<pre data-theme="Confluence">${textFontSize}</pre>
Colore color
Se specifichi una variabile come Colore, l’utente finale potrà immettere un valore di colore esadecimale o scegliere un colore dal selettore colore all’interno dell’editor e-mail. È possibile specificare una variabile Colore utilizzando <meta> con class="mktoColor"
Attributi richiesti
- id: come fai riferimento alla variabile all’interno del modello e-mail.
- mktoName: stringa. Questo è il nome visualizzato in Email Editor 2.0. Si consiglia di utilizzare un nome descrittivo.
Attributi facoltativi
- impostazione predefinita: Valore predefinito per il colore. Codice colore esadecimale a 6 cifre. Esempio: #ffffff.
- mktoModuleScope: booleano. Controlla se la variabile è locale (true) o globale (false) quando viene utilizzata in un modulo. Se omesso, il valore predefinito è False.
Esempio di dichiarazione:
<pre data-theme="Confluence"><meta class="mktoColor" id="textColor" mktoName="Main Text Color" default="#FFFFFF"></pre>
Esempio di utilizzo:
<pre data-theme="Confluence">${textColor}</pre>
Booleano boolean
Se specifichi una variabile come booleano, l’utente finale potrà attivare/disattivare l’opzione nell’editor e-mail. È possibile specificare una variabile booleana utilizzando <meta> con class="mktoBoolean"
Attributi richiesti
- id: come fai riferimento alla variabile all’interno del modello e-mail.
- mktoName: stringa. Questo è il nome visualizzato in Email Editor 2.0. Si consiglia di utilizzare un nome descrittivo.
Attributi facoltativi
- impostazione predefinita: Valore booleano che determina lo stato predefinito dell’interruttore di attivazione. False se omesso.
- false_value: Valore da inserire quando l’interruttore è in posizione OFF. False se omesso.
- true_value: Valore da inserire quando l'interruttore è in posizione ON. True se omesso.
- nome_valore_falso: L’interfaccia utente visualizzata in attiva/disattiva quando è in posizione OFF. False se omesso.
- true_value_name: L'interfaccia utente visualizzata in attiva/disattiva. True se omesso.
- mktoModuleScope: booleano. Controlla se la variabile è locale (true) o globale (false) quando viene utilizzata in un modulo. Se omesso, il valore predefinito è False.
Esempio di dichiarazione:
<pre data-theme="Confluence"><meta class="mktoBoolean" id="showFooter" mktoName="Show Footer BG?" default="false" false_value="transparent" true_value="black" false_value_name="NO" true_value_name="YES"></pre>
Esempio di utilizzo:
<pre data-theme="Confluence">${showFooter}</pre>
Blocco HTML html-block
Se specifichi una variabile come HTML Block (Blocco di HTML), l’utente finale potrà inserire testo letterale nell’editor e-mail. È possibile specificare una variabile HTML Block utilizzando <meta> con class="mktoHTML"
Attributi richiesti
- id: come fai riferimento alla variabile all’interno del modello e-mail.
- mktoName: stringa. Questo è il nome visualizzato in Email Editor 2.0. Si consiglia di utilizzare un nome descrittivo.
Attributi facoltativi
- impostazione predefinita: Valore con codifica HTML da utilizzare come contenuto predefinito del blocco.
- mktoModuleScope: booleano. Controlla se la variabile è locale (true) o globale (false) quando viene utilizzata in un modulo. Se omesso, il valore predefinito è False.
Esempio di dichiarazione:
<pre data-theme="Confluence"><meta class="mktoHTML" id="trackingPixel" mktoName="Add Tracking Pixel"></pre>
Esempio di utilizzo:
<pre data-theme="Confluence">${trackingPixel}</pre>
Variabile immagine image-variable
Se specifichi una variabile come Immagine, l’utente finale potrà scegliere un’immagine dal selettore delle immagini nell’editor e-mail. L’URL immagine selezionato sarà il valore della variabile. È possibile specificare una variabile immagine utilizzando <meta> con class="mktoImg"
Attributi richiesti
- id: come fai riferimento alla variabile all’interno del modello e-mail.
- mktoName: stringa. Questo è il nome visualizzato in Email Editor 2.0. Si consiglia di utilizzare un nome descrittivo.
Attributi facoltativi
- impostazione predefinita: URL immagine predefinito per l’elemento.
- mktoModuleScope: booleano. Controlla se la variabile è locale (true) o globale (false) quando viene utilizzata in un modulo. Se omesso, il valore predefinito è False.
Esempio di dichiarazione:
<pre data-theme="Confluence"><meta class="mktoImg" id="heroBackgroundImage" mktoName="Hero Background Image" default="https://www.company.com/image.jpg"></pre>
Esempio di utilizzo:
<pre data-theme="Confluence">${heroBackgroundImage}</pre>
Moduli modules
I moduli sono sezioni con modelli definite a livello di modello che verranno visualizzate e inserite dagli utenti finali nelle e-mail. Poiché questi moduli sono stati pregenerati, puoi assicurarti che interagiranno con il resto del contenuto dell’e-mail in modo agevole (in modo completamente reattivo). Puoi inserire un modulo solo in un contenitore.
Per contenitori di tipo <table>, <tbody>, <thead>, o <tfoot>:
Specificato tramite <tr> con class="mktoModule"
Per contenitori di tipo <td>:
Specificato tramite <table> con class="mktoModule"
Attributi richiesti
- id: come fai riferimento al modulo all’interno del modello e-mail.
- mktoName: stringa. Questo è il nome visualizzato in Email Editor 2.0. Si consiglia di utilizzare un nome descrittivo.
Attributi facoltativi
- mktoActive: Determina se questo modulo viene visualizzato nell’elenco dei moduli all’interno dell’editor e-mail. Impostazione predefinita: true. Se false, il modulo non può essere aggiunto a un’e-mail da un utente finale.
- mktoAddByDefault: Determina se questo modulo verrà incluso nell’area di lavoro di una nuova e-mail che utilizza questo modello al momento della creazione. Il valore predefinito è true (se mktoActive è false, questo valore viene ignorato).
Contenitori containers
Un contenitore contiene i Moduli e definisce dove possono essere posizionati. Quando gli utenti finali riordinano e inseriscono moduli nelle e-mail, il contenitore controlla dove possono andare.
Specificato utilizzando <table>, <tbody>, <thead>, <tfoot> o <td> con class="mktoContainer"
Attributi richiesti
id: come fai riferimento al modulo all’interno del modello e-mail.