L’interfaccia editor “drag&drop” (clicca e trascina) rappresenta il terzo step della sezione “Composizione email”.
In questa pagina è possibile creare un template da zero oppure, partendo da un template esistente, modificare testi e immagini, inserire link a siti web, pagine social o altri contenuti online, etc…

L’interfaccia del nuovo editor si suddivide in tre sezioni principali:

  1. La barra superiore
  2. L’area di lavoro
  3. La barra laterale destra

Editor Spiegazioni

1. La barra superiore
Tutti i template creati con l’editor Trendoo nascono responsive. Da questa barra utilizzando l’apposito comando puoi decidere quale vista impostare: mobile o desktop. Avrai così sempre sotto controllo il risultato grafico finale dei tuoi mailing.

Barra superiore Editor Drag&Drop

2. L’area di lavoro
L’area di lavoro mostra in tempo reale l’anteprima del tuo mailing.

Oltre a fornirti una preview in tempo reale, questa sezione ti permette di lavorare ai contenuti e alle strutture del tuo template. Ogni elemento (contenuto o struttura) può essere selezionato e modificato. Una cornice blu indica sempre su quale elemento stai attualmente lavorando.
Le possibili modifiche effettuabili sono:

  • spostare l’elemento in un’altra posizione
  • cancellare l’elemento selezionato
  • duplicare l’elemento selezionato

Area Contenuti Editor Drag&Drop

3. La barra Laterale di Destra

La barra laterale di destra è il vero e proprio centro di gestione per la creazione della tuo mailing. Da qui è possibile inserire nuovi elementi e/o strutture e modificarne le proprietà.

La barra laterale è divisa a sua volta in tre tab principali:

  1. Elementi: da qui è possibile selezionare e trascinare i singoli elementi (contenuti e/o strutture) all’interno dell’area contenuti
  2. Proprietà: a seconda dell’elemento o struttura selezionata nell’area di lavoro, sarà possibile editarne le specifiche proprietà
  3. Impostazioni generali del body: più defilate, definiscono gli assetti base del template

Barra Laterale Editor Drag&Drop

3.1 Gli elementi

Gli elementi disponibili per la costruzione/modifica del template si suddividono in due categorie principali:

1. Strutture/colonne
Definiscono l’architettura base della tua email. Esistono diverse combinazioni:

  • una colonna
  • due colonne (nei formati 50/50, 25/75, 75/25)
  • tre colonne (nei formati 33/33/33, 25/25/50, 50/25/25,)
  • quattro colonne (25/25/25/25)

2. Contenuti
Una volta inserita almeno una struttura/colonne nell’area di lavoro, è possibile trascinare al suo interno i vari contenuti.
I contenuti disponibili sono:

Elemento Testo
L’elemento testo permette di inserire un contenuto testuale all’interno della newsletter. Di default appare un testo standard (lorem ipsum) che potrà essere modificato a piacimento tramite doppio clic all’interno dell’area contenuti. L’editor inline, che appare nell’area contenuti cliccando due volte sul testo stesso, permette di modificare gli stili del testo (interlinea, font, colore e allineamento), di aggiungere campi dinamici, elenchi puntati o numerati o link.

Elemento Immagine
Permette di inserire un’immagine all’interno del template. L’immagine può essere caricata al momento oppure può essere selezionata dal proprio File Manager tramite l’apposito bottone “Sostituisci”. Per maggiori dettagli consultare la sezione Gestione immagini della guida.

Elemento Bottone
Permette di inserire un pulsante, anche detto “call to action”, all’interno della tua mail. Sempre attraverso le proprietà puoi editarne lo stile e stabilire l’azione legata al clic: apertura di una pagina web, apertura di una landing e/o invio di un’email.

Elemento Divisorio
Trascinando questo elemento all’interno dell’area contenuti viene inserita una linea orizzontale, utile per suddividere i contenuti della tua mail. Una volta trascinato l’elemento nel template, è possibile decidere le proprietà di base dell’elemento divisorio (colore, altezza e larghezza, stile, etc.)

Elemento Social
L’elemento social permette di inserire delle icone per i social network preferiti, che sarà poi possibile personalizzare tramite le proprietà inserendo il link al proprio profilo o pagina social.

Elemento Disiscrizione
Si tratta di un breve testo personalizzabile che porta tramite collegamento alla pagina di disiscrizione dalla newsletter. Questo è l’unico elemento obbligatorio per poter procedere all’invio della mail, va necessariamente inserito.

Elemento Video
Questo elemento posizionerà una preview del video ospitato su YouTube o Vimeo e l’utente cliccandoci sopra verrà reindirizzato al video originale.

Elemento HTML
Si tratta di un pezzo di codice html che è possibile usare per inserire elemento personalizzati in tutto e per tutto o elementi embedded.

Elemento WebVersion
L’elemento web version inserisce il classico link “Se non visualizzi correttamente la mail clicca qui” che consente ai destinatari di visualizzare la versione web dell’email nel caso in cui non riuscissero a vederla correttamente nel client di posta, ad esempio. Il testo può essere modificato e posizionato ovunque nel template.

4. Le Azioni
Nella parte inferiore della barra laterale destra potete eseguire una serie di operazioni:

Azioni Editor Drag&Drop

Invio email di prova
(icona aeroplanino) Prima di inviare la newsletter alla tua lista contatti, ti consigliamo di testare sempre l’invio. Cliccando sul bottone INVIA EMAIL DI PROVA presente nella parte inferiore della barra laterale, potrai scegliere di inviare la tua bozza email ad un massimo di 5 indirizzi email.

Salvare la propria mail come bozza
(icona bustina aperta) Il bottone Salva in bozze ti permette di salvare le ultime modifiche. Cliccando su questo bottone potrai poi navigare o chiudere il browser con la certezza di poter riprendere la composizione della tua email in un secondo momento, semplicemente ricercando la bozza nella sezione Campagne Email.

Salvare la propria mail come template
(icona floppy disk) Il bottone Salva come template ti permette di salvare il modello nella sezione “I Miei Template”. Potrà quindi essere utilizzato come modello base per tutte le tue prossime newsletter.

Visualizzazione versione HTML
(icona <>) Selezionando questa opzione è possibile vedere ed editare il codice sorgente HTML della mail creata.

Nel momento in cui avrete modificato o composto la vostra EMAIL in maniera definitiva, potrete procedere allo STEP 4 cliccando sul pulsante AVANTI.

Gestione immagini →