Hai delle domande?

Home informazioni aero-right Modelli & Creazione Email aero-right Sezioni e blocchi per email

Sezioni e blocchi per email

Modelli & Creazione Email Aggiornato il novembre 18, 2021

Aggiungi nuove sezioni e riorganizza i blocchi mentre disegni la tua email. Utilizza le sezioni per creare emails personalizzate, aggiungendo nuove colonne e blocchi per contenuti come immagini, testo o pulsanti. Con l’Editor Drag & Drop, creare campagne email con stile è facile e veloce, sappiamo che questa è una cosa che i nostri clienti amano e apprezzano.

Argomenti trattati in questo articolo:

 

 


 

Sezioni

 

Le sezioni sono ciò che utilizzerai per strutturare la tua email nell’editor. Le sezioni ti consentono di dividere i tuoi contenuti e fungono da contenitore per i blocchi di contenuto. Puoi aggiungere nuove sezioni ed eliminarle durante la creazione dell’email. Definire lo stile delle diverse sezioni dell’email individualmente.

 

Ecco come funzionano le sezioni:

  1. Il bottone (+) più fornisce cinque diversi tipi di colonne che possono essere aggiunte al layout; non c’è limite al numero di sezioni che la tua email può avere. Le sezioni disponibili sono:
    • Una colonna
    • Due colonne
    • Tre colonne
    • Due colonne con una barra laterale sinistra
    • Due colonne con una barra laterale destra
  2. La matita apre le impostazioni di stile per quella sezione specifica. È possibile assegnare un colore di sfondo e un bordo a un’intera sezione o per colonna se si utilizza una sezione a più colonne.
    • Le impostazioni di stile di una sezione possono essere aperte anche facendo clic in un punto qualsiasi all’esterno dell’area di quella sezione.
    • Tieni presente che se desideri modificare lo stile del blocco, è possibile farlo dalle impostazioni individuali del blocco.
  3. Le frecce su e giù ti consentono di riordinare le sezioni nell’email.
    • Ogni sezione, ad eccezione delle sezioni preheader e footer, possono essere spostata verso l’alto o verso il basso, inoltre nessun’altra sezione può essere posizionata sopra l’intestazione o sotto la sezione del footer.
    • Il blocco del footer che contiene i link di iscrizione può essere spostato all’interno dell’email; tuttavia, ti consigliamo di mantenere il blocco del footer nella sezione apposita dell’email. Mantenere il blocco del footer nella sezione inferiore della tua email può offrire ai tuoi iscritti un modo semplice per annullare l’iscrizione o gestire le loro preferenze email.
  4. Il cestino cancella una sezione. Ogni volta che elimini una sezione, verrà eliminato anche qualsiasi contenuto aggiunto in precedenza, come blocchi o stili; l’opzione di cancellazione non è reversibile. Per aiutarti ad evitare di perdere contenuti preziosi, ti verrà chiesto di confermare l’eliminazione.

 

Torna su

 


 

Stile Globale

 

Nelle impostazioni Stile Globale, puoi gestire lo schema dei colori della tua email; puoi anche aggiungere un colore di sfondo universale e aggiungere un bordo alla tua email.

Schema di colori

Sono disponibili 27 diverse combinazioni di colori; scegli quello più adatto alle tue esigenze. Le sezioni e i blocchi possono ancora essere personalizzati anche se è stata selezionata una combinazione di colori specifica.

Colore di sfondo

L’opzione del colore di sfondo ti consente di selezionare un colore specifico per lo sfondo dell’email. Puoi scegliere tra i colori disponibili o aggiungere il codice del colore. Inoltre, è possibile assegnare a singole sezioni e blocchi il proprio colore di sfondo.

Bordo email

È possibile modificare lo sfondo a larghezza intera o con cornice nell’opzione del bordo email. Lo sfondo a larghezza intera non ha opzioni di stile aggiuntive.

Nell’opzione di sfondo incorniciato, puoi aggiungere o modificare quanto segue:

  • Bordo
  • Colore bordo 
  • Dimensione bordo
  • Contorno
    • Smussa gli angoli dell’email.
Mostra sezioni

L’opzione Mostra sezioni ti consente di visualizzare tutte le sezioni nella tua email, seleziona Nascondi sezioni, per rimuovere i nomi delle sezioni. Da questa schermata, puoi anche fare clic su qualsiasi blocco da modificare.

 

Torna su


 

Blocchi

 

Separati dalle sezioni, ci sono i blocchi. È qui che verrà inserito il contenuto della tua email, come per esempio immagini, testo e pulsanti. Ogni blocco di contenuto ha diverse opzioni di stile.

Per aggiungere un blocco alla tua email, fai clic sul blocco desiderato e trascinalo in una sezione dell’email.

Di seguito sono riportati i blocchi disponibili nell’editor delle email:

 


 

Blocco immagine e blocco immagine tessera

 

Con questi blocchi, puoi caricare un’immagine o selezionarla dalle immagini già presenti nella tua galleria. 

Un blocco di immagini aggiungerà un’immagine al tuo layout, mentre il blocco di immagine e testo aggiungerà un’immagine e un testo all’interno di una cornice.

Qui vedi un blocco di immagini a sinistra e un blocco di immagini e testo a destra.

Quale usare?

Usa il blocco immagine quando è necessario aggiungere un’immagine semplice.

Invece, il blocco immagine tessera è utile quando devi aggiungere una descrizione all’immagine. Se si dovesse sposta questo blocco, anche la descrizione si sposterà.

Per scoprire di più si cosa puoi fare con i blocchi immagine e come aggiungere un’immagine, fai clic qui.

Potrebbe interessarti:

 

Torna al menù dei blocchi


 

Blocco immagine con didascalia

 

Ci sono tre tipi diversi di aggiungere la didascalia nel blocco:

  • Testo a destra
  • Testo a sinistra
  • Testo in basso

Un blocco immagine con didascalia è un blocco che consente di aggiungere del testo all’interno di un’immagine. La differenza principale con il blocco immagine e testo è che quello con didascalia non ha la cornice o contenitore, invece l’altro ha la possibilità di regolare il bordo del layout come nell’esempio seguente (blocco con didascalia a sinistra, blocco di immagine e testo a destra).

Per informazioni su come aggiungere un blocco Didascalia, fai clic qui.

 

Torna al menù dei blocchi


 

Blocco di testo

 

Puoi aggiungere testo alla tua email attraverso il blocco di testo. Per utilizzare questo blocco, trascinalo semplicemente nel punto desiderato. Una volta lì, fai clic su di esso e sostituisci il testo predefinito con il tuo.

Ecco alcune cose da notare sull’uso di questo blocco di testo.

Per modificare il testo, utilizza la barra degli strumenti situata sopra la tua email. Lì troverai le opzioni comuni di modifica del testo. Hai anche altre opzioni di modifica, come la conversione del testo in un’ancora, l’aggiunta di un link, un’immagine o anche il collegamento di un documento.

Copia e Incolla

Se hai del testo che desideri copiare e incollare, ti consigliamo di utilizzare l’opzione Incolla. L’uso di questa opzione rimuove tutti i caratteri nascosti nel testo che potrebbero interferire con la visualizzazione del testo.

Codice sorgente

Per aggiungere il codice sorgente, fare clic sull’icona del codice e incollare il codice.

Se non vedi le opzioni sopra menzionate, fai clic sull’icona Altro dalla barra degli strumenti.

 

 

Nota: in alcuni casi, vedrai il logo TinyMCE durante la modifica di un blocco di testo. TinyMCE è una terza parte che utilizziamo per rendere il nostro Drag and Drop migliore e più veloce. Il logo non apparirà nelle tue email, ma solo quando modifichi un blocco di testo.

 

 

 

Torna al menù dei blocchi


 

Blocco video

 

I video sono strumenti visivi molto efficaci. Attraverso i video, puoi mostrare le qualità di un prodotto o i motivi per cui dovrebbero scegliere te invece di altri concorrenti. 

Se vuoi imparare come caricare un video nella tua galleria video e come aggiungerlo, fai clic qui.

 

Torna al menù dei blocchi


 

Blocco divisore

 

Usa i divisori per creare spazi tra gli elementi nella tua email. I divisori non devono essere spazi vuoti. per aggiungere un blocco divisore trascinalo nella sezione desiderata. 

Scopri tutte le possibilità di divisori qui.

 

Torna al menù dei blocchi

 


 

Blocco pulsante

 

La CTA (call to action) è la parte più interessante della tua email. I bottoni si possono utilizzare per far visitare una landing page. Per aggiungere un pulsante, trascinalo nella posizione desiderata. Per ulteriori informazioni sulle opzioni di modifica per i pulsanti, consultare il nostro glossario.

  1. Nell’area di testo del pulsante aggiungi il testo. Rendi il tuo testo accattivante per attirare l’attenzione dei tuoi iscritti.
  2. Innanzitutto, seleziona il tipo di collegamento, quindi aggiungi l’URL. Tieni presente che potrebbe trattarsi di un URL esterno o anche di un’area nella stessa email. Esistono due modi per aggiungere collegamenti:
    1. È possibile aggiungere un collegamento facendo clic sull’opzione di collegamento nella barra degli strumenti.
    2. Oppure seleziona il tipo di collegamento nell’opzione di contenuto del blocco del pulsante. Nota: per aggiungere un’ancora, devi prima creare l’ancora.
  3. Utilizza la barra degli strumenti del testo per definire lo stile del testo o per aggiungere un collegamento.
  4. Se hai più pulsanti nell’email, non è necessario andare uno per uno per personalizzarli. Personalizza un pulsante, quindi seleziona Applica stile a tutti i pulsanti.

 

 

Torna al menù dei blocchi


 

Blocco Social condivisione & follow

 

I blocchi dei social media sono essenziali. Il nostro editor ti offre due tipi di blocchi per aggiungere i tuoi social network. Per utilizzare uno qualsiasi dei blocchi, trascinalo nel punto desiderato.

Il blocco social follow ti consente di aggiungere la tua icona dei social media o l’icona più il testo. Questo blocco ti consentirà fino a 20 diversi servizi, tra cui Facebook, Twitter, Whatsapp, Linkedin, YouTube, Pinterest, RSS, Vimeo, TripAdvisor, tra gli altri.

Il blocco di condivisione social ti consentirà di aggiungere: Facebook, Twitter, Linkedin, Myspace e Instapaper. Questo blocco consentirà agli utenti di condividere la tua email direttamente con i social network menzionati.

Quale usare?

Se desideri indirizzare i tuoi destinatari ai tuoi social network, utilizza il blocco Follow. Quindi possono fare clic sul social desiderato e mettere Mi piace o aggiungere il tuo profilo tra i preferiti.

Ora, se desideri che gli utenti condividano i tuoi contenuti, utilizza il blocco Condivisione.

Per imparare a utilizzare le impostazioni, vai al glossario.

Segui queste istruzioni per aggiungere un servizio in entrambi i blocchi:

  1. Trascina il blocco desiderato o fai clic su un blocco social esistente nel tuo layout.
  2. Nel pannello di sinistra, vai alla scheda Contenuto.
  3. Fai clic sul menu a discesa Aggiungi un servizio, selezionare un servizio, quindi fare clic sull’icona (+) più accanto alla casella.
  4. Nel tuo layout, fai clic sull’icona del nuovo servizio aggiunto di recente. Nel pannello a sinistra potrai personalizzare l’icona e tutto.
  5. Aggiungi il collegamento e personalizza le tue icone. Al termine, è possibile utilizzare l’opzione Applica raggio a tutti i pulsanti nell’opzione di blocco per aggiungere lo stesso raggio a tutti i pulsanti.

 

 

Inoltre, quando passi il mouse su un’icona social, hai la possibilità di spostarla o eliminarla.

 

 

Torna al menù dei blocchi


 

Barra di navigazione

 

La barra di navigazione può essere utilizzata per indirizzare i destinatari dell’email ad altre parti dell’email con un ancoraggio, oppure può essere utilizzata per collegamenti esterni.

Come aggiungere una barra di navigazione

  1. Trascina e rilascia l’icona della barra di navigazione nel tuo layout. La maggior parte degli utenti preferisce mostrare questa barra nell’intestazione dell’email.
  2. Per impostazione predefinita, la barra di navigazione avrà un aspetto simile a questo:
  3. Ora, fai clic su un collegamento nella barra di navigazione. Le opzioni di collegamento verranno visualizzate nel pannello di sinistra.
  4. Aggiungi il tipo di collegamento di cui hai bisogno e personalizzalo. È possibile rimuovere i collegamenti nella sezione contenuto a sinistra.
  5. Facendo clic su un collegamento, è inoltre possibile modificare il colore e l’aspetto del bordo di divisione. Questo bordo è facoltativo se non lo desideri, cambia semplicemente il suo colore in trasparente o lo spessore della linea a zero.

Come personalizzare una barra di navigazione

 

Per ulteriori informazioni sulla scheda Contenitore, vai al Glossario.

  1. Per aggiungere un collegamento, fai semplicemente clic sull’icona più. Per personalizzare il collegamento, fai clic su di esso e le opzioni del collegamento verranno visualizzate nel pannello a sinistra. È possibile aggiungere fino a sei collegamenti. Esistono due opzioni di collegamento; testo o immagine; puoi scegliere qualsiasi opzione. Per ulteriori informazioni sui diversi tipi di collegamento, fai clic qui.
  2. Esistono tre tipi di layout disponibili per i collegamenti della barra di navigazione. È possibile combinare immagini e testo. Fai clic su tutti gli stili e scegli quello più adatto al tuo design.
  3. Utilizzare le opzioni di allineamento verticale e orizzontale per formattare la barra.
  4. Lo stile mobile consente di scegliere tra l’opzione predefinita, a pila verticale, a pila e al centro verticali. Puoi scegliere l’aspetto del tuo design su un dispositivo mobile.

 

 

Torna al menù dei blocchi


 

 

Blocco e-Commerce

 

Il blocco Ecommerce può essere utilizzato per promuovere e vendere prodotti nelle tue email.

Il blocco Ecommerce include quanto segue:

  1. Immagine
  2. Descrizione del prodotto 
  3. Prezzo del prodotto 
  4. Sezione del pulsante

Per utilizzare il blocco del prodotto, clicca sul blocco e trascinalo in una sezione della tua email.

Per personalizzare il tuo blocco Ecommerce, segui i passi seguenti. 

  1. Comincia aggiungendo un’immagine del prodotto. 
  2. Aggiungi una descrizione del prodotto; questa dovrebbe essere breve e descrittiva. 
  3. Aggiorna il prezzo del tuo prodotto. 
  4. Quindi, è possibile personalizzare il pulsante del prodotto con quanto segue. 
    • Testo del pulsante.
    • Bottone URL, aggiungi un URL dove i tuoi contatti possono andare per completare il loro acquisto.
    • Infine, stilizza il pulsante per adattarlo al tuo marchio. Per risparmiare lavoro ripetitivo, puoi impostare lo stesso stile per tutti i pulsanti della tua email. Per saperne di più sulle opzioni di stile dei pulsanti, clicca qui.

Se preferisci non usare nessuno degli elementi del blocco, semplicemente disattivali nella scheda Contenuto.

  1. Quando hai finito, clicca su Salva e poi su Salva e Avanti o semplicemente clicca fuori dall’e-mail per salvare il tuo lavoro.

Ecco alcuni esempi di come il blocco Ecommerce può essere usato e stilizzato.

 

Torna al menù dei blocchi


 

Esempi di Emails

Le email di esempio che riportiamo di seguito mostrano le sezioni e i blocchi che abbiamo utilizzato durante la progettazione dell’email.

 

Esempio 1

Abbiamo iniziato aggiungendo una barra di navigazione nella sezione dell’intestazione. Il titolo in questo esempio utilizza la sezione della barra laterale sinistra, quindi nella seconda colonna, abbiamo aggiunto le immagini e il testo utilizzando i blocchi della scheda immagine. Infine, nella colonna in basso a sinistra, abbiamo aggiunto le icone dei social media e richiesto la conferma di iscrizione agli iscritti.

 

 

Esempio 2

Qui abbiamo creato un’email utilizzando sezioni a una e due colonne. Abbiamo anche aggiunto uno sfondo incorniciato e utilizzato l’opzione per arrotondare il bordo nelle impostazioni globali per enfatizzare il corpo dell’email.

 

 

Esempio 3

In questo ultimo esempio, abbiamo creato un’email utilizzando più sezioni di colonna. Abbiamo usato un divisore per mostrare lo spazio tra le sezioni. Come puoi vedere nell’email, abbiamo utilizzato blocchi di immagini, blocchi di testo, blocchi di pulsanti, blocchi di social media e un blocco video.

 

 

Torna su


 

Glossario

 

Le impostazioni del contenuto variano a seconda del blocco che stai modificando.

Colore di sfondo

Con questa opzione puoi impostare il colore di sfondo di un blocco. Per usarlo, fai clic sul cerchio dei colori e seleziona un colore dalla barra dei colori. Se hai il codice Hex, incollalo direttamente nella casella. Fai clic su Salva quando hai finito. L’opzione di ripristino riporterà l’elemento al suo aspetto originale.

Bordi e stile linea

Alcuni elementi hanno l’opzione bordo disponibile. È possibile impostare un bordo di colore facendo clic nel cerchio dei colori, quindi selezionare un colore dalla barra dei colori. Puoi anche utilizzare i codici Hex. Per lo stile del bordo, scegli uno dei nove stili di linea disponibili e aggiungi uno spessore da 0 a 99. Se non vuoi il bordo, cambia semplicemente il suo colore in trasparente o lo spessore della linea a zero. L’opzione di ripristino riporterà l’elemento al suo aspetto originale.

Arrotondare angolo/raggio

È possibile in alcuni elementi arrotondare gli angoli. È possibile impostare il raggio da 0 a 20. Al termine, è possibile impostare lo stesso arrotondamento a tutti i pulsanti facendo clic nel check box.

Spazio tra icone / Dimensione canale

Lo spazio tra le icone è un’opzione disponibile in alcuni blocchi come la barra di navigazione, il follow social e il blocco di condivisione social. Questa opzione definisce lo spazio tra un elemento e l’altro. Per impostare lo spazio fai scorrere il punto verde da 0 a 20.

Padding e Margini

Il padding e i margini di solito sono opzioni disponibili nella scheda Contenuto. Entrambi sono relativi allo spazio che circonda un elemento. È possibile impostare la spaziatura interna o il margine facendo scorrere la barra.

Allineamento

L’opzione di allineamento è relativa alla posizione di un elemento. Puoi impostarlo facendo clic sulle opzioni di allineamento desiderate; al centro, a sinistra, a destra, in basso o in alto.

Line Height / Interlinea

L’opzione dell’interlinea è disponibile solo per un blocco di testo e viene utilizzata per definire lo spazio tra due righe. Le opzioni disponibili sono Singolo, 1.25, 1.5 e Doppio.

Codice Hex

Il codice Hex o esadecimale è il valore che rappresenta un colore. Questo codice inizia con un cancelletto (#) ed è seguito da sei caratteri; ad esempio, #CFCFDA i caratteri potrebbero essere numeri o lettere. I codici esadecimali possono essere utilizzati per aggiungere i colori del tuo marchio. Se non sei sicuro di quali siano i colori del tuo codice esadecimale, puoi utilizzare un software di progettazione o un color picker online.

Torna su

 


 

Se hai dubbi o domande sulle sezioni o sui blocchi, non esitare a contattarci via Email o LiveChat.

 


Hai trovato la risposta alla tua domanda?
Hai già votato!