Come utilizzare l'elemento multi colonna e i suoi vantaggi

Tempo di lettura: 3 minuti

Difficoltà: Intermedia

Uno degli elementi più utile dell'editor Drag&Drop è la colonna, questa infatti consente di suddividere la struttura della tua email in due o più colonne. Questa soluzione è molto utile nel caso si voglia creare moduli composti da immagine + testo, testo + CTA (bottone), ecc. In questa guida spiegheremo come inserirlo e perché preferirlo rispetto a moduli simili già pronti all'utilizzo.

In questa guida:

Come suddividere l'email in due colonne

Durante la creazione di un email hai a disposizione diverse soluzioni per strutturarne il contenuto tra cui il più classico è quello di utilizzare un layout a colonna singola, ovvero inserire tutti gli elementi incolonnati uno sotto l'altro. In alternativa è possibile utilizzare un layout ibrido ovvero inserire all'interno della tua email a una colonna un modulo composto da due 2 o più colonne.

Per creare un layout a due colonne basta inserire nella posizione desiderata  l'elemento "Colonna" e di default l'editor suddividerà l'elemento in due colonne.

Utilizza l'elemento BOX

Quando crei un modulo a più colonne assicurati che questo sia contenuto in un elemento box. Il box ti consente di poter gestire con maggiore facilità impostazioni come i margini, il padding e il colore di background. Inoltre potrai salvare l'intero elemento trai i moduli "Preferiti" in modo da poterlo riutilizzare in modo facile e veloce.

Impostazioni delle colonne

L'elemento colonna ti mette a disposizione numerosi elementi di personalizzazione, vediamoli insieme.

Impostazioni colonne

All'interno della voce "colonna" è possibile:

- Cambiare l'ordine delle colonne. Selezionando una singola colonna nel wireframe delle impostazioni potrai cambiare l'ordine delle colonne con un semplice Drag&Drop.

- Aggiungere ulteriori colonne tramite il bottone "Aggiungi colonna".

- Impostarne la medesima larghezza per tutte le colonne utilizzando il bottone "Equalizza colonna".

- Impostare la larghezza di ogni singola colonna selezionandola con un click quindi agendo sui pixel dell'impostazione "larghezza".

- Mostra / Nascondi una colonna su dispositivi mobile. Seleziona la colonna che vuoi nascondere quindi clicca sull'icona smartphone per disabilitarne la visualizzazione.

- Bloccare la larghezza di una colonna. Se desideri dare maggiore spazio a una specifica colonna, o evitare che questa diventi troppo piccola, puoi utilizzare la la funzione "Blocca larghezza colonna". Seleziona la colonna quindi bloccane la larghezza cliccando sull' icona lucchetto.

Impostazioni mobile

Tra le impostazioni fondamentali quando si utilizza un elemento colonna è la loro gestione nel caso vengano visualizzati su mobile. Di default l'editor imposta che i contenuti vengano incolonnati in modo da rendere l'email responsive, tuttavia puoi disabilitare il riordino automatico togliendo la spunta alla voce "Riordina colonne su mobile".

In alcuni casi può risultare utile nascondere l'interno elemento sui dispositivi mobile per farlo in modo rapido e veloce basta attivare la spunta "Nascondi sul mobile".

Cosa puoi creare con le colonne

L'elemento colonna è molto versatile e ti consente di creare diversi moduli, eccoti alcuni esempi:

- Modulo immagine + testo

- Modulo immagine + immagine

- Modulo testo + testo

- Modulo testo + bottone

- Modulo immagine + bottone

- Modulo icone social follow / share

Riassumendo:

  • Uno degli elementi più utile dell'editor Drag&Drop è la colonna. questa infatti consente di suddividere la struttura della tua email in due o più colonne.
  • Per creare un layout a due colonne basta inserire nella posizione desiderata  l'elemento "Colonna" e di default l'editor suddividerà l'elemento in due colonne.
  • Tra le impostazioni fondamentali quando si utilizza un elemento colonna è la loro gestione nel caso vengano visualizzati su mobile. Di default l'editor imposta che i contenuti vengano incolonnati in modo da rendere l'email responsive.
Questa guida ti è stata utile? Grazie per il tuo feedback. Si è verificato un problema durante l'invio del tuo feedback. Per favore riprova più tardi.

Hai ancora bisogno di aiuto? Contattaci Contattaci