Modifica dei formati di testo normale, HTML e e e-mail per dispositivi mobili

Designer e-mail consente di modificare il rendering dei messaggi e-mail. Potete generare una versione di testo dell’e-mail, modificare l’origine HTML di un messaggio e-mail e progettare e-mail per la visualizzazione mobile.

Generazione di una versione di testo dell'e-mail

Per impostazione predefinita, la versione Plain text dell'e-mail viene generata automaticamente e sincronizzata con la versione Edit.

I campi di personalizzazione e i blocchi di contenuto aggiunti alla versione HTML sono sincronizzati anche con la versione in testo normale.

NOTA

Per utilizzare i blocchi di contenuto nella versione in testo normale, accertatevi che non contengano codice HTML.

Per avere una versione di testo normale diversa dalla versione HTML, potete disattivare la sincronizzazione facendo clic sul passaggio Sync with HTML dalla vista Plain text del messaggio e-mail.

Potete quindi modificare la versione di testo normale come desiderato.

NOTA

Se modificate la versione Plain text mentre la sincronizzazione è disattivata, la successiva attivazione dell'opzione Sync with HTML, tutte le modifiche apportate nella versione in testo normale verranno sostituite con la versione HTML. Le modifiche apportate nella vista Plain text non possono essere riportate nella vista HTML.

Modifica di un'origine di contenuto e-mail in HTML

Per gli utenti più avanzati e il debug, potete visualizzare e modificare il contenuto dell'e-mail direttamente in HTML.

Potete modificare la versione HTML del messaggio e-mail in due modi:

  • Selezionate Edit > HTML per aprire la versione HTML dell'intero messaggio e-mail.

  • Dall'interfaccia WYSIWYG, selezionate un elemento e fate clic sull'icona Source code.

    Viene visualizzata solo l'origine dell'elemento selezionato. Potete modificare il codice sorgente se l'elemento selezionato è un componente di contenuto HTML. Altri componenti sono in modalità di sola lettura, ma possono essere modificati nella versione HTML completa del messaggio e-mail.

Se modificate il codice HTML, la reattività dell’e-mail potrebbe non essere corretta. Assicurarsi di verificarlo utilizzando il pulsante Preview. Consulta Anteprima dei messaggi.

Progettazione di e-mail per il rendering mobile

Potete regolare il design reattivo di un’e-mail modificando separatamente tutte le opzioni di stile per la visualizzazione mobile. Ad esempio, potete adattare margini e spaziatura, usare font di dimensioni più piccole o grandi, modificare i pulsanti o applicare colori di sfondo diversi, specifici per la versione mobile dell’e-mail.

Tutte le opzioni di stile sono disponibili nella visualizzazione mobile. Le impostazioni di stile di Designer e-mail sono precedentemente presentate in questa pagina.

  1. Create un messaggio e-mail e iniziate a modificare il contenuto. Per ulteriori informazioni, vedere Progettazione di un contenuto e-mail da zero.

  2. Per accedere alla visualizzazione dedicata per dispositivi mobili, fate clic sul pulsante Switch to mobile view.

    Viene visualizzata la versione mobile dell’e-mail. Contiene tutti i componenti e gli stili definiti nella visualizzazione desktop.

  3. Modificate in modo indipendente tutte le impostazioni di stile come il colore di sfondo, l’allineamento, la spaziatura, il margine, la famiglia di font, il colore del testo e così via.

  4. Quando modificate un’impostazione di stile in visualizzazione mobile, le modifiche vengono applicate solo al display del dispositivo mobile.

    Ad esempio, riducete le dimensioni di un’immagine, aggiungete uno sfondo verde e modificate la spaziatura nella visualizzazione mobile.

  5. Potete nascondere un componente quando viene visualizzato su un dispositivo mobile. A questo scopo, selezionare Show only on desktop devices dal Display options.

    Potete anche scegliere di nascondere il componente sui dispositivi desktop, il che significa che verrà visualizzato solo sui dispositivi mobili. A questo scopo, selezionare Show only on mobile devices.

    Ad esempio, questa opzione consente di visualizzare un’immagine specifica su dispositivi mobili e un’altra su dispositivi desktop.

    Potete impostare questa opzione dalla visualizzazione mobile o desktop.

  6. Fate di nuovo clic sul pulsante Switch to mobile view per tornare alla visualizzazione desktop standard. Le modifiche di stile appena apportate non vengono riportate.

    NOTA

    L'unica eccezione è rappresentata dalle impostazioni Style inline. Qualsiasi modifica alle impostazioni di stile in linea viene applicata anche alla visualizzazione desktop standard.

  7. Qualsiasi altra modifica alla struttura o al contenuto dell’e-mail, ad esempio modifiche di testo, caricamento di una nuova immagine, aggiunta di un nuovo componente e così via. viene applicata anche alla visualizzazione standard.

    Ad esempio, tornate alla visualizzazione mobile, modificate del testo e sostituite un’immagine.

  8. Fate di nuovo clic sul pulsante Switch to mobile view per tornare alla visualizzazione desktop standard. Le modifiche vengono riportate.

  9. Se rimuovete uno stile nella visualizzazione mobile, tornerete allo stile applicato in modalità desktop.

    Ad esempio, nella visualizzazione mobile, applicate un colore di sfondo verde a un pulsante.

  10. Passate alla visualizzazione desktop e applicate uno sfondo grigio allo stesso pulsante.

  11. Passate nuovamente alla visualizzazione mobile e disattivate l'impostazione Background color.

    Viene ora applicato il colore di sfondo definito nella visualizzazione desktop: diventa grigio (non vuoto).

    L'unica eccezione è l'impostazione Border color. Se disabilitato in visualizzazione mobile, non viene più applicato alcun bordo, anche se nella visualizzazione desktop è definito un colore per il bordo.

NOTA

La visualizzazione mobile non è disponibile nei frammenti.

In questa pagina

Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free
Adobe Summit Banner

A virtual event April 27-28.

Expand your skills and get inspired.

Register for free