Iniziate a utilizzare e-mail Designer e create modelli e frammenti riutilizzabili dal codice HTML dell'e-mail creato nell'editor legacy.
Questo caso d'uso consente di creare un modello di E-mail Designer utilizzando un'e-mail HTML e dividendolo in componenti HTML in Designer e-mail.
Come la modalità di compatibilità, un componente HTML è modificabile con opzioni limitate: è possibile eseguire solo edizioni interne.
Questa sezione è destinata agli utenti esperti che hanno familiarità con il codice HTML.
Passate a Mobile view. Per ulteriori informazioni, consulta questa sezione.
Per risolvere il problema, passare alla modalità codice sorgente e copiare e incollare la sezione di stile in una nuova sezione di stile. Ad esempio:
<style type="text/css">
a {text-decoration:none;}
body {min-width:100% !important; margin:0 auto !important; padding:0 !important;}
img {line-height:100%; text-decoration:none; -ms-interpolation-mode:bicubic;}
...
</style>
Accertatevi di aggiungere lo stile dopo questo in un altro tag di stile personalizzato.
Non modificate il CSS generato da Designer e-mail:
<style data-name="default" type="text/css">(##)</style>
<style data-name="supportIOS10" type="text/css">(##)</style>
<style data-name="mediaIOS8" type="text/css">(##)</style>
<style data-name="media-default-max-width-500px" type="text/css">(##)</style>
<style data-name="media-default--webkit-min-device-pixel-ratio-0" type="text/css">(##)</style>
Tornate alla visualizzazione mobile per verificare che il contenuto sia correttamente visualizzato e salvare le modifiche.
Proviamo a convertire questo messaggio e-mail, creato nell'editor legacy, in un modello Email Designer.
In questa e-mail possiamo identificare 11 sezioni.
Per identificare quale elemento è la sezione dell’HTML, potete selezionarla.
Per visualizzare la versione HTML del messaggio e-mail, fate clic su Show source.
Trascinare Structure components per riflettere il layout dell'e-mail.
Ripetere la procedura il numero di volte necessario. Dobbiamo creare 11 componenti della struttura.
Inserire un HTML component in ogni Structure component .
Per ciascuna sezione, fare clic su Show source code .
Inserite la sezione HTML.
Fai clic su Save.
Ora potete controllare il rendering dell'e-mail.
Inserite elementi CSS per assicurarvi che il messaggio e-mail sia adatto alla visualizzazione mobile.
Passate al codice sorgente e copiate e incollate la sezione di stile in una nuova sezione di stile.
Per ulteriori informazioni, fare riferimento a Gestione dello stile dell'e-mail.
L'e-mail precedente è ora disponibile in Designer e-mail.