Come si crea e pubblica un form
Tempo di lettura: 8 minuti
Difficoltà: Media
Requisiti: Jquery caricato dal tuo sito versione 3.2 o superiori.
Lead plus non è un semplice generatore di form, ti consente infatti un'ampia personalizzazione sia del form che dei suoi comportamenti. Potrai decidere quale tipologia di form utilizzare, i comportamenti di visualizzazione, quante volte mostrarlo, impostare un progressing profiling (profilazione progressiva). Non servono competenze di programmazione, ma sarà tutto gestibile in tempo reale dalla tua console, basta solo incollare poche linee di codice appena prima del tag </body> sulle pagine del tuo sito web.
NB. Da giugno 2021 non esistono più i crediti impression!
In questa guida:
Come creare un Form
Per creare un Form/Popup vai su "CREA CAMPAGNA" presente nel menu verticale di sinistra, quindi scegli come tipologia campagna "Form e Popup". In alternativa entra nella sezione "Cresci" > "Form e Popup" del menu verticale di sinistra e clicca su "crea campagna".
Inserisci ora il nome della campagna e seleziona la lista da associare. È molto importante scegliere un nome che identifichi in maniera univoca la campagna per poterla poi riconoscere subito fra le altre che creeremo.
Cambiare le liste
La lista non potrà essere più cambiata una volta creata la campagna.
Durata, obiettivi e impostazioni
Proseguiamo la creazione della campagna inserendo la durata. Tramite un click nei campi data si aprirà un comodo calendario dal quale potrai selezionare il giorno di inizio e di fine e tra le OPZIONI AVANZATE possiamo decidere anche il FUSO ORARIO e se ripetere una campagna "form e popup".
Imposta ora qual è l’ obiettivo della campagna, possiamo scegliere fra:
- Sconto per offrire una promozione all’utente;
- Download per far scaricare all’utente materiale come per esempio e-book o brochure;
- Newsletter per inserire l’utente all’interno della nostra lista newsletter;
- Recontact per farsi lasciare i dati per ricontattare l’utente.
Per finire ricordati di definire come si deve comportare 4Dem nel caso un utente già registrato compili il form. Fai click su SUCCESSIVO appena terminato.
Tipologia di form e scelta del tema
Procediamo con il scegliere la tipologia di form da utilizzare.
 |
Embedded |
Questo tipo ti form potrà essere inserito sopra, sotto o in un punto specifico della tua pagina web. |
|
 |
Top/Bottom |
Scegli se mostrare il form sulla parte alta o bassa della tua pagina web. |
|
 |
Pop up (pop over) |
L’effetto pop up per coinvolgere i tuoi visitatori. Scegli anche gli effetti di transizione che preferisci. |
|
 |
Scroll box |
In basso a sinistra o in basso a destra. Il modo migliore per essere coinvolgenti ma discreti. |
Cambiare tipo di form
La scelta della tipologia del form va affrontata molto attentamente in base agli obiettivi che ti sei posto e al tipo di pagina in cui vuoi inserire la campagna "form e popup". Potrai modificare la tipologia anche in seguito mantenendo i campi e i testi inseriti in fase di personalizzazione ma perderai il layout modificato tramite l’editor LeadPlus.
Procediamo ora a selezionare il tema.
È possibile scegliere fra numerosi temi già pronti per essere personalizzati e utilizzati in base alle vostre esigenze, oppure possiamo scegliere di partire da modelli base e proseguire alla creazione e personalizzazione del form.
Per selezionare un tema è necessario passarci sopra con il mouse e fare click sul bottone azzurro SCEGLI.
Scelto il tema possiamo fare click su SUCCESSIVO per iniziare a personalizzare il form con l’editor LeadPlus.
L'editor di LeadPlus
La personalizzazione della campagna (layout form e comportamenti) avviene all'interno dell'editor di Lead Plus attraverso 4 Step.
STEP1 - Pagine e messaggi -
In pagine e messaggi è possibile determinare il numero delle pagine di un Form (1d), editare il titolo (1a), editare la descrizione (1b) e il testo mostrato dai bottoni (1c).
Possiamo in oltre decidere il testo per spostarsi tra le pagine del nostro form e inserire le briciole di pane.
Sempre in questo step tramite la tab PAGINE THANKYOU (1e) puoi editare quello che sarà il titolo (1f), il messaggio (1g) di feedback e di ringraziamento che verrà mostrato all’ utente al termine della compilazione del form.
Per passare al secondo step fai click sul bottone azzurro in alto a destra “SALVA E CONTINUA”, oppure con un click su “Campi” nella barra di avanzamento azzurra “4/ CONTENUTO”.
STEP2 - Campi
Nel secondo step possiamo modificare o aggiungere quelli che saranno i CAMPI che comporranno il form.
- Aggiungi i campi che vuoi far compilare all’utente o inserisci campi accettazione (2a);
- per ogni campo del form puoi decidere il titolo (2b) e se mostrarlo o nasconderlo (2c);
- inserisci dei placeholder come esempio(2d), oppure inserisci dei valori di default (2e);
- decidi se rendere un campo obbligatorio oppure nasconderlo (2f);
- imposta la larghezza dei campi con “Larghezza colonna” (2g);
- puoi anche modificare testo e disposizione del campo d’ accettazione (2h).
Procedi al prossimo step con “SALVA E CONTINUA”.
STEP3 - Design e colori
Personalizziamo ora in maniera unica il layout del contenitore e del form.
Sono molte le possibilità di personalizzazione che l’editor LeadPlus ti offre, spendi il giusto tempo per trovare il layout migliore ed efficace per la tua campagna.
Contenitore:
- modifica i colori dei testi (3a), le dimensioni del form (3b) e l’immagine di sfondo (3c);
- puoi intervenire anche sui bordi del form inserendo l’effetto ombra (3d) o smussando gli angoli (3e);
- aggiungi un’animazione di apertura e chiusura del form (3f), inserisci le briciole di pane (3g PREMIUM) in caso form su più pagine;
- presta attenzione al bottone di chiusura (3h), rendilo facilmente riconoscibile e cliccabile;
- decidi se mostrare o meno il logo “Powered by 4Dem.it” (3i PREMIUM).
Form (3l)
- Modifica il colore di sfondo, del testo o di background dei campi del form (3m);
- inserisci un’immagine di sfondo (3n);
- cambia lo stile dei campi (3o);
- modifica i bottoni inserendo degli effetti di mouse-over, colori, spessore, larghezza, la smussatura degli angoli e l’allineamento del bottone (3p).
STEP4 - Regole e comportamenti
Una volta definita la struttura e il layout della nostra campagna ci rimane da impostare le REGOLE E COMPORTAMENTI del nostro form per ottimizzare al meglio l’esperienza dell’utente sul sito web.
Nota Bene!
Ricorda di compilare correttamente la voce "URL Sito Web" aggiungendo il dominio del tuo sito ed eventualmente ricorda di inserire come sotto regole le pagine web dove vorrai vedere comparire il tuo form. Il formato della url deve essere ad esempio "www.miosito.it" senza https. Per dominio intendiamo tutto quello che sta dopo https://.
| Regole - Visualizzazione - Messaggio finale - Hook - Iscrizione - Integrazione | |||
| Device | Su quali device vuoi mostrare la campagna |
 |
|
| Url |
Su quali pagine desideri mostrare il tuo form. |  |
|
| Evento specifico |
Decidi quando dovrà apparire il form all’interno del sito web. |  |
|
| Controllo temporale | Dopo quanti secondi deve essere mostrato il form. |  Parametro selezionabile solo se non entra in conflitto con quanto scelto in “Evento specifico” |
|
| Iterazioni | Inserisci il numero di volte che dovrà essere visualizzato. |  |
|
| Permanenza | Decidi se mostrare il form finché non viene compilato. |  |
|
| Messaggio finale | Decidi quale pagina mostrare dopo che l’utente ha compilato il form. |
 |
|
| Hook | Inserisci le url di una o più pagine a cui vuoi mandare i dati del form. |
 |
|
| Iscrizione |
Invia una notifica a uno specifico indirizzo email dopo che un utente si è registrato |  |
|
| Integrazione |
Integra il form con pagamenti PayPal |  |
|
| Integrazione |
Integra il tuo form con Google Analytics |
 |
|
| Anti-spam |
Proteggi il tuo form |
 |
|
| Comportamenti | ||
| Visualizzazione |
Inserisci i criteri di visualizzazione. |
 |
| Abilita/Richiedi | Abilita o richiedi campi in base agli elementi inseriti dall’utente. |
 |
| Progressive profiling | Inserisci tutti i campi nel form e poi stabilisci le regole per richiedere quei dati spalmati in più step di visite sul tuo sito. |  |
| Thank you |
Crea più “thank you page” e decidi quale mostrare in base ai valori inseirti dall’utente. |  |
Terminato di impostare il layout e le regole della tua campagna Lead Plus fai click sul bottone SALVA E CONTINUA. Il sistema ci chiede se siamo sicuri di voler proseguire, confermiamo per giungere alla schermata di riepilogo.
Ora non ti resta che decidere se pubblicare subito la tua campagna o di salvarla in bozze tramite i due bottoni in basso a destra della schermata di riepilogo
Pubblicare il form sul tuo sito
Copiamo il codice che al termine della creazione della campagna ti viene mostrato e spostiamoci sul nostro sito web.
Nei seguenti passaggi mostreremo il procedimento usando Word Press come esempio, ma la procedura è simile anche per altri CMS.
Accediamo alla dashboard WordPress della nostro sito web e spostiamoci su “ Appearance”, quindi selezioniamo l’ultima voce “Editor”.
Dalla colonna “ Templates” di destra selezioniamo THEME FOOTER.
Andiamo adesso sul codice e scrolliamo in basso fino a cerca il tag di chiusura </body>.
Inseriamo il codice copiato nella riga prima del tag (vedi screenshot sotto).
Inserisci il codice d’integrazione prima del tag </body>
Copiato il codice fai click su UPDATE FILE.
Il form è ora collegato al tuo sito web e potrai gestire comodamente tutte le tue campagne comodamente dalla console 4Dem.
EMBEDDED FORM
Se per gli altri tipi di form basta inserire il codice d’integrazione del form, nel caso dell’embedded questo non basta. Questa tipologia di form infatti consente di far apparire la nostra campagna in un punto esatto della pagina.
Il codice di embed ti verrà fornito nella schermata di riepilogo della campagna (screenshot sotto) oppure cliccando su "codice d'integrazione".
Selezioniamo la voce “Codice d’integrazione” e copiamo il secondo codice che ci viene mostrato.
Andiamo ora sul nostro sito web alla pagina in cui vogliamo che appaia la campagna "form e popup" e apriamo l’editor della pagina.
Andiamo in modalità text e incolliamo il codice copiato nella posizione della pagina in cui vogliamo far comparire la campagna (vedi screenshot sotto).
Inserito il codice non ti resta che pubblicare la pagina!
Il codice di embed è disponibile anche per altri tipi di form, ad esempio pop up, consentendo di inserire il form con precisione nella nostra pagina. Puoi per esempio inserire il codice di embed di un popup dentro un bottone e questo apparirà al click dell’utente.
Selezionando l’icona delle impostazioni (icona a forma di ingranaggio) potrai accedere alle seguenti opzioni riguardanti la singola campagna tra cui il codice d’integrazione:
Modifica campagna - modifica la campagna ripercorrendo i passi della creazione;
Modifica contenuto - vai direttamente all’editor per modificare il contenuto e le regole di una campagna;
Codice d’integrazione - mostra i codici d’integrazione del form;
Link pubblico - consente di vedere un’anteprima del form tramite un link pubblico;
Duplica - consente di duplicare una campagna con un click.
Utilizzare codici sconto in un form
Quando stai per creare la tua campagna "Form e popup" puoi selezionare come obiettivo "Sconto", questa scelta abiliterà la possibilità di inserire un tuo file di codici sconto (file csv con grandezza massima di 65 MB).
Importato il file contenente i codici sconto dovrai selezionare a quale campo personalizzato vorrai associare i codici inseriti dai tuoi utenti e quante volte vuoi che venga utilizzato un codice.
Nel caso non avessi creato il campo personalizzato seleziona la voce "Crea campo personalizzato" e la console ne creerà uno in automatico.
Creare un gruppo di form
Un gruppo può essere creato sia in fase di creazione campagna sia cliccando sul bottone azzurro "GRUPPI DI FORM" presente nella pagina in alto a destra.
Per creare un gruppo basta un click sul bottone verde “CREA GRUPPO DI FORM”.
Procediamo ora ad inserire:
- Il nome del gruppo - come sempre è bene scegliere nomi univoci e non fraintendibili;
- I form - da associare ad un determinato gruppo, puoi inserire più di un form tramite la selezione dal menu a tendina.
Procediamo ora a creare il gruppo con un click sul bottone SALVA.
Potremo quindi decidere di inserire sul nostro sito il codice del gruppo di form e poi gestire manualmente i singoli form dalla piattaforma. In questo modo non avremo bisogno di interpellare tutte le volte il supporto tecnico della nostra azienda per poter attivare/disattivare singoli form!
Immagina un gruppo di form come una cartella organizzata che contiene i form associati ad un determinato progetto.
Riassumendo:
- Crea una nuova campagna di Conversione form.
- Seleziona la lista a cui associare il form.
- Imposta la durata della campagna.
- Seleziona l'obiettivo e il gruppo.
- Definisci il comportamento in caso di utenti già iscritti in lista.
- Seleziona il tipo di form e un tema.
- Procedi a personalizzare layout e comportamenti.
- Pubblica la campagna.
- Integra il codice sul tuo sito prima della chiusura del tag </body>.
- Gestisci i tuoi form direttamente dalla console