Anteprima di un modulo con WPForms

Come visualizzare l'anteprima di una voce del modulo prima di inviarla

Volete che i vostri visitatori possano vedere un'anteprima dei loro inserimenti nel modulo prima di inviarli?

La possibilità di visualizzare in anteprima i dati inseriti riduce notevolmente le possibilità di errori e imprecisioni durante la compilazione dei moduli.

WPForms dispone di un campo di anteprima dell'inserimento che potete aggiungere facilmente ai vostri moduli, in modo che i vostri utenti possano vedere un rapido riepilogo dei loro inserimenti durante e dopo l'invio.

In questo post, vi mostreremo come aggiungere il campo Anteprima di entrata e personalizzarlo in diversi modi in WPForms.

Creare ora un modulo con le anteprime delle voci

Come visualizzare l'anteprima di una voce del modulo prima di inviarla

Seguite la nostra guida passo passo per scoprire come aggiungere un'anteprima di invio ai vostri moduli.

Cominciamo.

1. Installare WPForms

Per iniziare, scegliete un piano WPForms adatto e registrate il vostro account. Quindi, accedere all'area del proprio account WPForms e fare clic sulla scheda Download. Si aprirà una pagina in cui è possibile premere il pulsante Download WPForms per scaricare il file zip.

Scaricare il pulsante WPForms

Mentre siete su questa pagina, assicuratevi di copiare la vostra chiave di licenza. Ne avrete bisogno in seguito per attivare WPForms Pro sul vostro sito WordPress.

Chiave di licenza WPForms

Dopo aver scaricato il file zip sul computer, aprire la dashboard di amministrazione di WordPress e fare clic su Plugin " Aggiungi nuovo. Quindi, fate clic sul pulsante Carica plugin.

Plugin di caricamento

A questo punto, fate clic sul pulsante Scegli file e scegliete il file del plugin appena scaricato.

Freccia rossa rivolta verso il pulsante Scegli file

Fare clic su Installa ora quando il file viene caricato.

Installare ora wpforms

WPForms verrà ora installato sul vostro sito WordPress. L'operazione dovrebbe richiedere solo pochi secondi. Al termine dell'installazione, premere il pulsante Attiva plugin.

Attivare il plugin WPForms

Cliccare ora su WPForms " Impostazioni. Si aprirà la scheda Impostazioni generali. Scorrete verso il basso per trovare il campo Chiave di licenza e inserite qui la vostra chiave (che avete copiato in precedenza).

Chiave di licenza WPForms

Quindi, fare clic sul pulsante Verifica chiave. Questo completerà l'installazione di WPForms Pro sul vostro sito.

2. Aggiungere un nuovo modulo

Ora, aprite l'area di amministrazione di WordPress del vostro sito e fate clic su WPForms " Aggiungi nuovo nella barra laterale di sinistra. Ora potete assegnare un nome al vostro modulo, in modo da poterlo ritrovare facilmente in seguito.

Aggiungere un nuovo modulo

Scorrete verso il basso per selezionare un modello per iniziare a costruire il vostro modulo. Come tutti i campi di WPForms, il campo Anteprima iscrizione è supportato dalla maggior parte degli oltre 2.000 modelli di modulo disponibili.

Selezionare il modello

Una volta selezionato un modello, nel passaggio successivo aggiungeremo il campo Anteprima di iscrizione.

3. Aggiungere il campo di anteprima della voce del modulo

Nell'esempio seguente, utilizziamo un modulo personalizzato per la prenotazione di appuntamenti, ma siete liberi di utilizzare qualsiasi modello di modulo di vostra scelta.

Per aggiungere una funzione di anteprima al modulo, è sufficiente trascinare e rilasciare il campo Anteprima di iscrizione dal riquadro sinistro del costruttore al riquadro destro, dove si trovano i campi effettivi del modulo.

Semplice anteprima del modulo di contatto

Quando si aggiunge il campo Anteprima di iscrizione al modulo, viene aggiunta automaticamente una nuova pagina in cui apparirà l'anteprima.

Il campo Anteprima voce con interruzione di pagina nell'area di anteprima del costruttore di moduli

Ecco come appare l'anteprima in azione quando un utente sta compilando un modulo:

Anteprima del modulo semplice

È anche possibile posizionare il campo Anteprima della voce più volte all'interno del modulo. Ad esempio, se si dispone di un modulo a più pagine, è possibile inserire un campo Anteprima di inserimento dopo ogni pagina. In questo modo, gli utenti possono vedere in anteprima le informazioni inserite nelle pagine precedenti mentre continuano a compilare il resto del modulo.

anteprima dei campi di inserimento multipli del modulo

L'aggiunta di più campi per l'anteprima di inserimento nei moduli lunghi è un ottimo modo per assicurarsi che gli utenti siano in grado di visualizzare l'anteprima dei loro inserimenti e di tornare indietro in qualsiasi momento per apportare modifiche, se necessario.

4. Personalizzare l'avviso e lo stile dell'anteprima

WPForms consente di personalizzare l'avviso di anteprima. È sufficiente fare clic sul campo Anteprima di iscrizione nella vista del costruttore di moduli per aprire le impostazioni del campo.

È possibile utilizzare il pulsante Visualizza anteprima avviso per mostrare il messaggio sopra l'anteprima della voce o per nasconderlo del tutto.

Abilitazione dell'avviso del campo Anteprima voce

Inoltre, avete la libertà di modificare l'anteprima dell'avviso a vostro piacimento o di lasciare il messaggio predefinito.

Successivamente, è possibile modificare lo stile dell'anteprima della voce. Fare clic sulla scheda Avanzate nelle opzioni del campo Anteprima voce per scegliere tra 4 diversi stili di anteprima:

  • Base
  • Compatto
  • Tabella
  • Tavolo, compatto

Scelta dello stile dell'anteprima della voce

Lo stile predefinito è Basic, che visualizza un'anteprima riga per riga della voce del modulo.

Anteprima del modulo semplice

Se volete dare alla vostra anteprima un aspetto più stretto, potete optare per lo stile Compact .

Forma compatta

Questo completa l'impostazione del campo Anteprima di entrata nei moduli. Ma c'è un altro tipo di anteprima di entrata che si può aggiungere, come mostreremo nel prossimo passo.

5. Aggiungi anteprima della voce Conferma

Oltre alle anteprime di inserimento che appaiono durante la compilazione di un modulo, WPForms consente anche di visualizzare anteprime dopo che l'utente ha inviato il modulo.

A differenza del campo Anteprima dell'inserimento, gli utenti non hanno la possibilità di modificare i loro inserimenti quando viene visualizzata l'anteprima di conferma. Al contrario, viene mostrata solo una copia dell'invio che non può più essere modificato.

Per impostare l'anteprima di conferma dell'inserimento, andare su Impostazioni " Conferme nel costruttore di moduli di WPForms. Qui è possibile attivare il pulsante Mostra l'anteprima dell'inserimento dopo il messaggio di conferma.

Abilitazione della conferma dell'anteprima della voce

Una volta attivata questa opzione, apparirà un menu a tendina che consente di scegliere uno stile di anteprima, come abbiamo mostrato sopra per i campi di anteprima delle voci.

Selezione dello stile di conferma dell'anteprima di inserimento

È ancora possibile utilizzare le anteprime delle iscrizioni (che appaiono durante la compilazione del modulo) e la conferma dell'anteprima (che appare solo dopo l'invio delle iscrizioni). Oppure potete usare solo una o l'altra di queste opzioni. Tutto dipende dalle vostre preferenze e da ciò che state cercando di ottenere con i vostri moduli.

Conferma dell'anteprima

Ed ecco fatto! Ora è possibile consentire agli utenti di visualizzare l'anteprima di un modulo prima di inviarlo.

Perché si dovrebbe mostrare un'anteprima della voce?

La possibilità di visualizzare l'anteprima delle voci è molto utile, soprattutto quando si tratta di moduli più lunghi e complessi.

È normale commettere errori di battitura e di compilazione di un modulo, ma un'anteprima prima dell'invio consente di verificare l'accuratezza delle informazioni prima di premere il pulsante di invio.

Quindi, se volete ridurre al minimo gli errori e dare ai vostri utenti la possibilità di correggere eventuali errori prima dell'invio, dovreste includere il campo Anteprima dell'inserimento offerto da WPForms.

Successivamente, applicare le restrizioni di accesso ai moduli di WordPress

Volete limitare i vostri moduli WordPress ai soli utenti che hanno effettuato il login? WPForms vi consente di selezionare i livelli di autorizzazione degli utenti in base al loro stato di accesso. Per saperne di più, consultate il nostro articolo su come limitare i moduli di WordPress agli utenti connessi.

Potreste anche leggere la nostra guida sui migliori plugin per la barra di notifica di WordPress per promuovere le vendite e le offerte speciali sul vostro sito.

Creare ora un modulo con le anteprime delle voci

Siete pronti a creare il vostro modulo? Iniziate oggi stesso con il più semplice plugin per la creazione di moduli per WordPress. WPForms Pro include molti modelli gratuiti e offre una garanzia di rimborso di 14 giorni.

Se questo articolo vi ha aiutato, seguiteci su Facebook e Twitter per altre guide e tutorial gratuiti su WordPress.

Divulgazione: I nostri contenuti sono sostenuti dai lettori. Ciò significa che se fate clic su alcuni dei nostri link, potremmo guadagnare una commissione. Scoprite come WPForms viene finanziato, perché è importante e come potete sostenerci.

Osama Tahir

Osama è uno scrittore senior di WPForms. È specializzato nello smontare i plugin di WordPress per testarli e condividere le sue intuizioni con il mondo.Per saperne di più

Il miglior plugin per la creazione di moduli di WordPress con trascinamento e rilascio

Facile, veloce e sicuro. Unitevi agli oltre 6 milioni di proprietari di siti web che si fidano di WPForms.

Per completare questo modulo, abilitare JavaScript nel browser.

6 commenti su "Come visualizzare l'anteprima di un modulo prima di inviarlo".

  1. L'informazione è buona, ma non è del tutto chiaro come fare una conferma totale del modulo. Situazione: abbiamo un modulo multipagina e vogliamo confermare l'intero modulo alla fine. Non ogni pagina separatamente.

    1. Ciao Karina,

      L'anteprima delle voci dovrebbe funzionare bene anche con più pagine. Per le pagine multiple, si consiglia di collocare l'anteprima delle voci in una pagina a sé stante, alla fine del modulo, in modo che gli utenti la vedano solo dopo aver compilato gli altri campi. In questo modo sarà possibile visualizzare l'intera anteprima del modulo.

      Se può essere d'aiuto, ecco il nostro ottimo articolo sullo stesso argomento.

      Spero che questo sia d'aiuto!

    1. Ciao Claudio,

      Attualmente non disponiamo di una funzione nativa per visualizzare la descrizione del campo nell'anteprima della voce prima dell'invio. Ho aggiunto il vostro voto per considerare questa funzione per il futuro.

      Grazie!

  2. Sto utilizzando i pulsanti di opzione multi-item di Stripe. C'è un modo per impedire che l'anteprima mostri l'importo che verrà addebitato?
    Ad esempio, ho l'importo nel testo del pulsante di opzione. È confuso mostrarlo due volte.

    1. Ciao Sharon - Al momento non disponiamo della funzione per disabilitare/nascondere il prezzo nell'anteprima del modulo. Sono d'accordo che sarebbe una funzione utile e la aggiungerò al nostro tracker delle richieste di funzionalità in modo che sia all'attenzione dei vostri sviluppatori.

Aggiungi un commento

Siamo lieti che abbia scelto di lasciare un commento. Tenete presente che tutti i commenti sono moderati in base alla nostra politica sulla privacy e che tutti i link sono nofollow. NON utilizzare parole chiave nel campo del nome. Avremo una conversazione personale e significativa.

Questo modulo è protetto da Cloudflare Turnstile e si applicano l'Informativa sulla privacy e i Termini di servizio di Cloudflare.