Come creare un modulo di contatto Divi in WordPress
Pubblicato: 2022-01-20
Cerchi un modo semplice per creare un modulo di contatto Divi per il tuo sito WordPress?
Divi è uno dei temi WordPress più popolari sul mercato. Viene fornito con un builder intuitivo che ti consente di personalizzare il tuo sito Web dal front-end. Puoi aggiungere moduli di pagina come il pulsante di invito all'azione, il modulo di contatto e altro ancora.
Con il modulo Modulo di contatto Divi, puoi creare e inserire un modulo di contatto senza alcun servizio di terze parti. Questo è ottimo se desideri un modo semplice per aggiungere un modulo di contatto di base sul tuo sito.
Tuttavia, avrai bisogno di un potente plug-in per la creazione di moduli come WPForms per funzionalità avanzate come invii utente, email marketing e altro ancora.
Questo è il motivo per cui Divi Builder include anche un modulo WPForms in modo da poter aggiungere facilmente moduli di contatto professionali in pochi clic.
In questo post, ti mostreremo questi due metodi per creare un modulo di contatto Divi in WordPress:
- Crea un modulo di contatto con Divi Builder
- Crea un contatto Divi con WPForms
Creazione di un modulo di contatto con Divi Builder
Se non hai già Divi, devi prima registrarti per un account Divi . Quindi, sarai in grado di accedere alla dashboard e scaricare il file del tuo tema.

Dopo aver installato e attivato il tema Divi sulla dashboard di WordPress, apri qualsiasi pagina o post in cui desideri aggiungere il modulo di contatto Divi.
Nell'editor dei post, vedrai il pulsante Usa Divi Builder . Fai clic sul pulsante per avviare il builder nel front-end del tuo sito.

Nella schermata successiva, vedrai le opzioni per creare una pagina da zero, scegliere un layout predefinito o clonare una pagina esistente.
Per questo tutorial, inizieremo con la nuova pagina e aggiungeremo il modulo di contatto.

Quindi vedrai il builder Divi dove puoi scegliere un modello di riga che corrisponda alle tue esigenze.

Dopo aver aggiunto la riga, puoi vedere il pannello Inserisci modulo che ti consente di aggiungere diversi tipi di moduli di contenuto.
Se scorri verso il basso, troverai il modulo Modulo di contatto . Basta fare clic su di esso per inserire il modulo di contatto Divi sul tuo sito.

Per impostazione predefinita, il modulo di contatto è composto da tre campi modulo: Nome, E-mail e Messaggio. Puoi fare clic sul pulsante Aggiungi nuovo campo per aggiungere altri campi del modulo in base alle tue esigenze.

Inoltre, troverai le opzioni per modificare il titolo, il messaggio di invio riuscito e il testo del pulsante di invio nelle impostazioni del testo .

Divi ti consente anche di inviare messaggi di posta elettronica in modo da poter ricevere notifiche sui nuovi invii di moduli.
Inoltre, troverai altre opzioni utili come link di reindirizzamento, protezione antispam, impostazioni in background e altro.

Con il modulo modulo di contatto Divi, puoi facilmente aggiungere un semplice modulo di contatto al tuo sito WordPress. Ci sono molte opzioni di personalizzazione in modo da poter abbinare lo stile del tuo marchio.
Se desideri aggiungere funzionalità più avanzate al tuo modulo di contatto Divi, dovrai utilizzare un buon plug-in per la creazione di moduli.
Ed è esattamente ciò che faremo nel prossimo metodo. Ti mostreremo come creare un contatto Divi utilizzando il più potente generatore di moduli di WordPress, WPForms.
Crea un modulo di contatto Divi con WPForms

WPForms è il miglior plug-in per la creazione di moduli drag and drop per WordPress. Ti consente di creare qualsiasi tipo di modulo come moduli di contatto, moduli di registrazione, moduli di download e altro in pochi clic.
WPForms viene fornito con oltre 100 modelli di moduli predefiniti, quindi non è necessario creare un modulo di contatto da zero. Puoi aggiungere o rimuovere qualsiasi campo del modulo e personalizzarlo come preferisci. E non hai nemmeno bisogno di alcuna conoscenza di programmazione per questo.
Tutti i moduli di contatto che crei con WPForms saranno reattivi al 100%, quindi verranno visualizzati magnificamente su qualsiasi dimensione dello schermo. C'è anche un'opzione di protezione antispam integrata in modo da poter prevenire lo spam e l'invio di moduli fraudolenti sul tuo sito.
Con oltre 5 milioni di installazioni attive, WPForms è amato da tutti i tipi di aziende in tutto il mondo. Se sei un utente Divi e desideri aggiungere fantastici moduli di contatto al tuo sito, puoi anche andare avanti con WPForms.
Ecco alcuni dei motivi per cui dovresti creare il tuo modulo di contatto Divi con WPForms:
- facile da usare e impostare
- Notifiche e conferme di moduli avanzati
- Funzionalità di caricamento file e invio di contenuti
- Sistema di gestione dell'invio dei moduli integrato
- Integrazione dell'email marketing per far crescere la tua mailing list
- Opzione di abbandono del modulo per acquisire voci di moduli parziali
- Campi modulo per eCommerce e opzioni di pagamento
E la grande notizia è che c'è un modulo WPForms nel Divi Builder. Quindi puoi facilmente aggiungere il modulo di contatto che crei con WPForms sul tuo sito.
Inoltre, puoi utilizzare WPForms su qualsiasi sito WordPress, con o senza Divi. Se decidi di smettere di pagare per Divi, i moduli che crei con WPForms rimarranno intatti sul tuo sito.
Detto questo, impariamo come creare un modulo di contatto con WPForms + Divi.
Passaggio 1: installa e attiva il plug-in WPFroms
Prima di tutto, dovrai registrarti per un account WPForms.
WPForms offre piani tariffari flessibili progettati per soddisfare i requisiti di tutti i tipi di attività. Puoi scegliere un piano adatto alla tua attività. E c'è una versione lite che è disponibile gratuitamente.
Dopo esserti registrato, sarai in grado di accedere alla dashboard di WPForms. Troverai il file del plug-in insieme alla tua licenza nella scheda Download .

Devi installare questo file plug-in sul tuo sito WordPress. Per maggiori dettagli su questo, puoi consultare la nostra guida su come installare un plugin per WordPress.
Dopo aver installato e attivato WPForms sul tuo sito, vai alla scheda WPForms »Impostazioni nella dashboard dell'amministratore.
Qui, dovrai inserire la chiave di licenza e fare clic sul pulsante Verifica chiave .

Quindi, vedrai il messaggio di verifica riuscita. Ora puoi iniziare a creare il tuo modulo di contatto utilizzando WPForms.

Passaggio 2: crea un modulo di contatto
Per creare un nuovo modulo, vai alla scheda Aggiungi nuovo sulla dashboard di WordPress. Questo avvierà la libreria di modelli in cui puoi cercare un modello di modulo di contatto adatto per il tuo sito.
Per questo tutorial, inizieremo con il modello di modulo di contatto semplice . Questo modello include tutti i campi del modulo di base richiesti per un modulo di contatto come nome, e-mail e messaggio. Puoi anche visualizzare in anteprima qualsiasi altro modello per vedere quale è meglio per te.
Inserisci un nome per il tuo modulo di contatto e fai clic sul pulsante Usa modello sul modello di modulo di tua scelta.

Nella schermata successiva, vedrai il generatore di moduli trascina e rilascia di WPForm. Tutti i campi del modulo sono sul lato sinistro e l'anteprima del modulo è sul lato destro della pagina.
Troverai un'ampia gamma di campi modulo utili come numeri, menu a discesa, scelta multipla, caricamento file, valutazione, rich text e molto altro ancora.

Per inserire un campo modulo, devi solo trascinarlo dal lato sinistro e posizionarlo sull'anteprima del modulo.

Se desideri personalizzare uno di questi campi modulo, puoi fare clic su di essi e vedrai le opzioni del campo. Sono disponibili opzioni per modificare l'etichetta del modulo, la descrizione, le opzioni obbligatorie e altre opzioni aggiuntive a seconda del campo del modulo.

Dopo aver aggiunto tutti i campi richiesti al modulo di contatto Divi, fai clic sul pulsante Salva nella parte superiore del generatore di moduli.
Successivamente, dovrai configurare le impostazioni del modulo, le notifiche e le conferme.
Passaggio 3: configurare le impostazioni del modulo
Per modificare le impostazioni del modulo, apri la scheda Impostazioni »Generale dal pannello del menu a sinistra del generatore di moduli. Qui puoi modificare il nome del modulo, la descrizione del modulo, il testo del pulsante di invio e altro.
C'è anche la possibilità di abilitare la protezione anti-spam sul tuo sito. Questo imposterà Google reCAPTCHA per il tuo modulo di contatto.

Vai alla scheda Impostazioni »Notifiche per impostare le notifiche e-mail per il modulo di contatto Divi. Vedrai che c'è una notifica predefinita che viene inviata all'indirizzo email dell'amministratore.
Puoi aggiungere più indirizzi e-mail o fare clic sul pulsante Aggiungi nuova notifica per inviare più di un modulo di notifica.
Con questo, puoi notificare a te e ai membri del tuo team i nuovi invii di moduli, inviare ai clienti i dettagli di invio e altro ancora.

Se desideri maggiori informazioni su questo, puoi consultare la nostra guida su Come impostare le notifiche e le conferme del modulo corretto.
Allo stesso modo, WPForms ti consente di decidere cosa succede dopo che un utente ha inviato le proprie informazioni di contatto sul tuo sito. Vai alla scheda Impostazioni »Conferme e vedrai l'opzione per scegliere l'azione di conferma.

Quindi puoi mostrare un messaggio di ringraziamento personalizzato sul frontend dopo che l'utente ha premuto il pulsante di invio. In alternativa, scegli le opzioni di reindirizzamento per indirizzare gli utenti a una pagina diversa del tuo sito o a un URL esterno.
Una volta che hai finito con le impostazioni del modulo, assicurati di fare clic sul pulsante Salva .
Ora che il tuo modulo di contatto è pronto, puoi inserirlo nel tuo sito web utilizzando Divi Builder.
Passaggio 4: aggiungi il modulo WPForms in Divi
Per aggiungere questo modulo di contatto su qualsiasi pagina o post, apri Divi Builder e scegli un layout di riga come abbiamo fatto per il modulo modulo di contatto Divi.
L'unica differenza qui è che dovrai cercare il modulo WPForms .

Dopo aver inserito il blocco WPForms, vedrai le impostazioni per scegliere il modulo di contatto che hai appena creato. Ci sono anche opzioni per mostrare il titolo e la descrizione del tuo modulo di contatto.

Puoi persino modificare il design e lo stile del tuo modulo di contatto con Divi Builder. Quando sei soddisfatto dell'aspetto del tuo modulo di contatto Divi, fai clic sul pulsante con il segno di spunta a destra.
Passaggio 5: pubblica il modulo di contatto Divi
Il passaggio finale è pubblicare il modulo di contatto. Per questo, fai clic sul pulsante 3 punti nella parte inferiore di Divi Builder.

Quindi, vedrai le diverse opzioni come zoom, anteprima reattiva e altro. Sul lato destro, ci sono due pulsanti: Salva bozza e Pubblica.
Fai clic sul pulsante Pubblica per pubblicare la tua pagina e il modulo di contatto sul tuo sito WordPress.

Hai creato correttamente un modulo di contatto utilizzando Divi e WPForms. Sebbene Divi offra un modulo di contatto, manca di alcune funzionalità come il caricamento di file, la gestione delle voci e l'integrazione dell'elenco di posta elettronica.
Con WPForms puoi risolvere facilmente questi problemi. È ricco di caratteristiche e funzionalità che ti aiutano a creare tutti i tipi di moduli di contatto, da quelli di base a quelli professionali.
WPForms ti consente anche di creare moduli WordPress per qualsiasi scopo a seconda delle tue esigenze. Puoi creare moduli d'ordine, moduli di registrazione per eventi, moduli di iscrizione e molto altro ancora.
E per oggi è tutto! Ci auguriamo che questo tutorial ti abbia aiutato a imparare a creare facilmente un modulo di contatto Divi in WordPress.
Se desideri ulteriore assistenza con i moduli di WordPress, puoi consultare queste risorse:
- Come creare un modulo di registrazione per eventi in WordPress
- 8 migliori strumenti di acquisizione e-mail e generatori di moduli per WordPress
- Come ridurre facilmente l'abbandono della forma
Questi post ti aiuteranno a registrare gli utenti sui tuoi moduli WordPress e ad ampliare le tue liste di posta elettronica. L'ultimo ti aiuterà a ridurre i tassi di abbandono sul tuo modulo e a migliorare le tue conversioni.