Conversione del contenuto e-mail dell’editor legacy

Inizia a utilizzare E-mail Designer e crea modelli e frammenti riutilizzabili dal codice HTML dell’e-mail creato nell’editor legacy.

Questo caso d’uso consente di creare un modello E-mail Designer utilizzando un’e-mail HTML e di suddividerlo nei componenti HTML in E-mail Designer.

NOTA

Come la modalità di compatibilità, un componente HTML è modificabile con opzioni limitate: è possibile eseguire solo edizioni sul posto.

IMPORTANTE

Questa sezione è destinata agli utenti avanzati che hanno dimestichezza con il codice HTML.

Preparazione del contenuto dell’e-mail

  1. Seleziona un messaggio e-mail HTML.
  2. Identifica le sezioni per dividere l’e-mail HTML.
  3. Taglia i diversi blocchi dal tuo HTML.

Creare la struttura delle e-mail

  1. Apri Email Designer per creare un contenuto e-mail vuoto.
  2. Imposta gli attributi del livello del corpo: colori di sfondo, larghezza, ecc. Per ulteriori informazioni, consulta Modifica degli stili delle e-mail.
  3. Aggiungi tutti i componenti struttura disponibili. Per ulteriori informazioni, consulta Modifica della struttura delle e-mail.

Aggiungi contenuto HTML

  1. Aggiungi un componente HTML a ciascun componente struttura. Per ulteriori informazioni, consulta Aggiunta di frammenti e componenti.
  2. Copia e incolla il codice HTML in ogni componente.

Gestione dello stile dell’e-mail

  1. Passa a Mobile view. Per ulteriori informazioni, consulta questa sezione.

  2. Per risolvere il problema, passa alla modalità codice sorgente e copia-incolla la sezione stile in una nuova sezione 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>
    
    NOTA

    Assicurati di aggiungere lo stile dopo questo in un altro tag di stile personalizzato.

    Non modificare il CSS generato da E-mail Designer:

    • <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>
  3. Torna alla visualizzazione mobile per verificare che il contenuto sia visualizzato correttamente e salvare le modifiche.

Caso d’uso

Proviamo a convertire questa e-mail, creata nell’editor legacy, in un modello Email Designer.

Identifica la sezione dell’e-mail

Possiamo identificare 11 sezioni in questo messaggio e-mail.

Per identificare quale elemento è la sezione dell’HTML, puoi selezionarla.

Per visualizzare la versione HTML dell’e-mail, fai clic su Show source.

Creare il modello e-mail e la relativa struttura

  1. Trascina Structure components per rispecchiare il layout della nostra e-mail.

  2. Ripeti il numero di volte necessario. Dobbiamo creare 11 componenti della struttura.

Inserimento di componenti di contenuto HTML

  1. Inserisci un HTML component in ogni Structure component .

  2. Per ciascuna sezione, fai clic su Show source code .

  3. Inserisci la sezione HTML.

  4. Fai clic su Save.

Ora puoi controllare il rendering della tua e-mail.

Gestione degli stili per adattarli alla visualizzazione mobile

  1. Inserisci elementi CSS per assicurarti che l’e-mail sia adatta alla visualizzazione mobile.

  2. Passa al codice sorgente e copia e incolla la sezione stile in una nuova sezione stile.

Per ulteriori informazioni, consulta Gestire lo stile dell’e-mail.

L’e-mail legacy è ora disponibile in E-mail Designer.

In questa pagina

Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now
Adobe Maker Awards Banner

Time to shine!

Apply now for the 2021 Adobe Experience Maker Awards.

Apply now