Come aggiungere un popup con modulo di contatto in WordPress

Hai mai osservato i visitatori navigare sul tuo sito, per poi andarsene senza mettersi in contatto? È frustrante, soprattutto quando sai che sono interessati ma non riesci a connetterti.

Un popup semplice e ben posizionato può fare la differenza. 💡

Se posizionato in modo strategico, mette il tuo modulo di contatto proprio dove i visitatori ne hanno bisogno. Questo può portare a più richieste, feedback e conversioni.

Noi di WPBeginner siamo grandi fan di WPForms perché è facile da usare per i principianti, potente e perfetto per creare ogni tipo di modulo. Ancora meglio, puoi abbinarlo a OptinMonster per creare un popup per il modulo di contatto che sembri utile, non invadente.

In questa guida, ti spiegheremo come aggiungere un popup per il modulo di contatto in WordPress. Uno che trasforma i visitatori in lead, senza infastidirli.

Perché usare un popup per il modulo di contatto?

Un popup con modulo di contatto rende più facile per i visitatori contattarti senza interrompere la loro navigazione o la ricerca della tua pagina dei contatti.

Questo è importante perché ogni sito WordPress ha bisogno di un modo semplice per gli utenti di inviare domande, feedback o richieste di supporto. Ma quando il tuo modulo di contatto si trova solo su una pagina, molti visitatori potrebbero non trovarlo mai. E questo spesso porta a lead persi.

Un popup con modulo di contatto risolve questo problema consentendo ai visitatori di aprire il modulo con un singolo clic, da qualsiasi pagina del tuo sito. Possono contattarti subito senza lasciare la pagina che stanno attualmente visualizzando.

Aiuta anche a mantenere le persone sul tuo sito web invece di inviarle altrove. E come bonus, puoi utilizzare questi popup per raccogliere indirizzi email e far crescere la tua lista email.

In questa guida, ti mostreremo come creare un modulo di contatto e aggiungerlo a un popup in WordPress.

Condivideremo anche i nostri consigli esperti sulla creazione di un popup che attiri l'attenzione senza essere invadente. Questo approccio garantisce che il tuo sito WordPress rimanga user-friendly massimizzando le opportunità di interazione.

Ed ecco una rapida panoramica di tutti i passaggi che seguirai:

Pronto? Iniziamo.

Passaggio 1: Crea un modulo di contatto WordPress

Innanzitutto, dovrai selezionare un plugin per moduli di contatto WordPress.

Ci sono molte opzioni gratuite e a pagamento, ma consigliamo di utilizzare WPForms, perché è il miglior costruttore di moduli WordPress sul mercato. È anche il più facile da usare per i principianti, grazie agli strumenti AI, al costruttore drag-and-drop e ai modelli di moduli predefiniti.

Noi di WPBeginner lo utilizziamo sul nostro sito web per visualizzare moduli di contatto, sondaggi annuali degli utenti e moduli di migrazione del sito.

Per maggiori dettagli sulla nostra esperienza con il plugin, consulta la nostra recensione completa di WPForms.

Per iniziare, vai sul sito web di WPForms e fai clic sul pulsante 'Get WPForms Now'. Quindi, segui semplicemente i passaggi per creare il tuo account e completare l'acquisto.

Dopo il checkout, atterrerai nella dashboard del tuo account WPForms, dove potrai trovare la chiave di licenza del plugin.

Da qui, naviga su WPForms » Aggiungi Nuovo dalla tua dashboard di WordPress.

Nella schermata successiva, usa la barra di ricerca per trovare rapidamente il plugin WPForms.

Quando appare nei risultati di ricerca, fai clic su 'Installa ora' e poi su 'Attiva'.

Se hai bisogno di aiuto, puoi consultare la nostra guida passo passo su come installare un plugin WordPress per principianti.

Se acquisti WPForms Pro, dovrai attivare la tua chiave di licenza. Vai su WPForms » Impostazioni, inserisci la tua chiave nel campo corrispondente e fai clic su ‘Verifica chiave.’

Da qui, sei pronto per creare il tuo modulo di contatto.

Vai su WPForms » Aggiungi nuovo dalla tua bacheca di WordPress.

Nella schermata successiva, puoi inserire un nome per il modulo.

Quindi, selezionerai come costruirai il tuo modulo: utilizzando WPForms AI, un modello predefinito o una tela bianca.

Se desideri utilizzare il generatore di moduli AI, inserisci semplicemente un prompt. In pochi secondi, il tuo modulo verrà generato.

Detto questo, utilizzeremo il modello 'Modulo di contatto semplice' per questo tutorial perché ha tutto ciò di cui abbiamo bisogno.

Successivamente, puoi aggiungere campi al modulo utilizzando il generatore drag-and-drop.

Trascina semplicemente i campi che desideri aggiungere al modulo dalle opzioni disponibili nel menu sulla sinistra. Puoi anche riordinare i campi nel modulo.

WPForms ti consente anche di personalizzare ogni campo nel modulo di contatto.

Ad esempio, se fai clic sul campo ‘Nome’, vedrai le opzioni per modificarne l'etichetta e il formato. Puoi persino aggiungere una descrizione o contrassegnare qualsiasi campo come obbligatorio.

Per istruzioni dettagliate, consulta la nostra guida su come creare un modulo di contatto.

Una volta terminato, fai clic sull'opzione ‘Impostazioni’ per configurare la notifica e la conferma del modulo.

Nella sezione ‘Generale’, puoi rinominare il modulo, aggiungere una descrizione del modulo, modificare il testo del pulsante di invio, abilitare la protezione antispam e altro ancora.

Successivamente, puoi andare all'opzione delle impostazioni ‘Notifiche’. Per impostazione predefinita, le notifiche vengono inviate all'email dell'amministratore impostata sul tuo sito web WordPress.

Tuttavia, puoi inviare la notifica del tuo modulo di contatto a qualsiasi indirizzo email desideri. Se desideri ricevere notifiche di invio del modulo a più email, separa ogni email con una virgola.

Per la riga dell'oggetto dell'email, WPForms utilizza il nome del modulo che hai inserito in precedenza. Tuttavia, puoi modificare il testo della riga dell'oggetto come preferisci.

Ora, andiamo all'opzione ‘Conferme’.

WPForms utilizza ‘Messaggio’ come tipo di conferma predefinito. Questo mostra un messaggio di ringraziamento subito dopo l'invio del modulo. Oltre a ciò, vedrai le opzioni ‘Mostra pagina’ e ‘Vai a URL (Reindirizzamento)’.

Per i popup, tuttavia, consigliamo di mantenere questa impostazione ‘Messaggio’. Reindirizzare gli utenti a una pagina diversa può a volte sembrare brusco quando interagiscono con un popup.

Una volta terminata la creazione di un modulo di contatto, assicurati di fare clic sul pulsante ‘Salva’ nell'angolo in alto a destra per salvare le modifiche.

Successivamente, puoi fare clic sull'opzione ‘Incorpora’ nell'angolo in alto accanto al pulsante ‘Salva’ per ottenere lo shortcode del modulo. Avrai bisogno di queste informazioni per visualizzare il tuo modulo in un popup.

Quando appare un nuovo popup, puoi selezionare l'opzione ‘Usa uno shortcode’.

WPForms quindi visualizzerà lo shortcode per il tuo modulo di contatto non appena fai clic sul link. Ti suggeriamo di mantenere aperta questa scheda o finestra perché avrai bisogno dello shortcode nel passaggio successivo, dove ti mostreremo come aggiungere il tuo modulo di contatto in un popup.

Passaggio 2: Aggiungi un popup per moduli di contatto al tuo sito WordPress

Per creare un popup per il modulo di contatto, avrai bisogno di un plugin popup per WordPress.

Ti consigliamo di utilizzare OptinMonster, poiché è il miglior plugin per la generazione di lead e l'ottimizzazione delle conversioni per WordPress. È anche uno dei più popolari, con oltre 1,2 milioni di siti web che utilizzano questo potente strumento.

Su WPBeginner, utilizziamo OptinMonster per varie attività, tra cui la promozione di offerte speciali e sconti su popup, slide-in e banner nell'intestazione. Se desideri maggiori informazioni, non esitare a leggere la nostra recensione completa di OptinMonster.

Per questo tutorial, utilizzeremo la versione Pro di OptinMonster, che include un modello pulito e regole di visualizzazione avanzate per mostrare il popup.

Quindi, registriamoci per un account andando sul sito web di OptinMonster. Visita semplicemente il sito web e fai clic sul pulsante ‘Ottieni OptinMonster Ora’.

Dopo la registrazione, atterrerai nella dashboard del tuo account OptinMonster. Tieni aperta questa scheda, poiché collegheremo il tuo account a WordPress tra un momento.

Successivamente, devi installare e attivare il plugin gratuito OptinMonster sul tuo sito web. Questo plugin funge da connettore tra il tuo sito web e il tuo account OptinMonster.

Nella tua bacheca di WordPress, vai su Plugin » Aggiungi Plugin.

Nella schermata successiva, usa la barra di ricerca per trovare ‘OptinMonster’.

Quindi, fai clic su ‘Installa ora’ e ‘Attiva’ per abilitarlo correttamente.

Per maggiori dettagli, puoi seguire la nostra guida su come installare un plugin WordPress.

Dopo che il plugin è attivo, vedrai la procedura guidata di configurazione.

Fai clic sul pulsante ‘Connect Your Existing Account’.

Ora apparirà una finestra popup e OptinMonster ti chiederà di connetterti al tuo account.

Fai semplicemente clic sul pulsante ‘Connetti a WordPress’.

Ora che il tuo account è connesso, la prossima cosa da fare è creare una nuova campagna per il popup del tuo modulo di contatto.

Puoi iniziare andando su OptinMonster » Campagne e quindi facendo clic sul pulsante ‘Crea la tua prima campagna’.

Nella schermata successiva, dovrai selezionare un tipo di campagna.

Poiché creeremo un popup per il modulo di contatto, seleziona ‘Popup’ come tipo di campagna.

Dopodiché, dovrai scorrere la pagina verso il basso per scegliere un modello.

OptinMonster offre oltre 75 design accattivanti e altamente performanti per i tuoi popup. Puoi selezionare qualsiasi modello che ti piace.

Una volta deciso il modello, inserisci semplicemente un nome per la tua campagna e fai clic sul pulsante 'Inizia a costruire'.

Ora, utilizzando il builder drag-and-drop in OptinMonster, puoi modificare il tuo modello di popup.

Vedrai diversi blocchi apparire nel menu sulla sinistra. Individua il blocco ‘WPForms’, quindi trascinalo e rilascialo sul tuo modello.

Dopodiché, fai clic sul menu a discesa ‘Selezione modulo’ nelle impostazioni del blocco a sinistra.

Scegli semplicemente il modulo di contatto che hai creato in precedenza dall’elenco. Se non vedi il tuo modulo elencato, puoi selezionare ‘Aggiungi Shortcode Manualmente’ e incollare lo shortcode che hai copiato nel Passo 1.

Inserisci il tuo shortcode del modulo di contatto WPForms nel blocco. Se hai perso il tuo shortcode, puoi tornare alla pagina delle impostazioni di incorporamento di WPForms e copiare lo shortcode.

È importante notare che non vedrai un’anteprima del modulo di contatto nel modello quando aggiungi lo shortcode. Questo è normale, poiché il tuo modulo di contatto apparirà quando la campagna verrà pubblicata.

Successivamente, puoi andare alla scheda 'Regole di visualizzazione' in alto per scegliere quando il popup dovrebbe apparire sul tuo sito web.

Per impostazione predefinita, OptinMonster lo imposterà su quando il tempo sulla pagina è di 5 secondi e il popup apparirà su qualsiasi pagina. Tuttavia, puoi modificare le impostazioni delle regole di visualizzazione e selezionare diversi trigger e opzioni di targeting.

Ti consigliamo di utilizzare il targeting MonsterLink (On Click). Questo attiva il popup solo quando un utente fa clic su un link o un pulsante specifico. Mette il visitatore al controllo ed è molto meno invasivo di un popup che si apre automaticamente.

Successivamente, puoi fare clic sul pulsante 'Copia codice MonsterLink' e aggiungerlo a qualsiasi testo, immagine o pulsante sul tuo sito web.

Per maggiori dettagli, puoi seguire la nostra guida per principianti su come aggiungere un link in WordPress.

Il tuo codice MonsterLink apparirà così in HTML:

<a href="https://app.monstercampaigns.com/c/ep6f5qtakxauowbj8097/" target="_blank" rel="noopener noreferrer">Subscribe Now!</a>

Non hai bisogno del codice HTML completo – hai solo bisogno dell'URL. Quindi puoi copiare il testo del link che inizia con https://.

Ecco come dovrebbe apparire l'URL:

https://app.monstercampaigns.com/c/ep6f5qtakxauowbj8097/

Ad esempio, supponiamo che tu voglia aggiungere un pulsante Contattaci sul tuo sito.

In questo caso, puoi iniziare modificando una qualsiasi pagina o articolo e andando al tuo editor di WordPress. Quindi, fai clic sul segno (+) in alto e aggiungi un blocco 'Pulsanti'.

Dopodiché, puoi inserire il testo per il tuo pulsante e fare clic sull'icona del link. Ad esempio, usiamo ‘Contattaci’ come testo del pulsante.

Ora, aggiungiamo l'URL di MonsterLink. Fai clic sul blocco del pulsante per selezionarlo, quindi fai clic sull'icona Link nella barra degli strumenti. Incolla semplicemente l'URL che hai copiato in precedenza e premi ‘Invio’.

Una volta fatto ciò, procedi e pubblica il tuo articolo o pagina di WordPress. MonsterLink verrà ora aggiunto al tuo pulsante 'Contattaci'.

Ora, torniamo alla tua campagna OptinMonster per completare la configurazione.

Dopo aver selezionato MonsterLink come destinazione e averlo mostrato su qualsiasi pagina, puoi fare clic sul pulsante 'Avanti' in basso.

Nella schermata successiva, vedrai le opzioni per modificare il tipo di visualizzazione della campagna, aggiungere un'animazione MonsterEffect e riprodurre un suono quando appare il popup.

Sentiti libero di sperimentare con diverse impostazioni di animazione e suono. Al termine, fai clic sul pulsante ‘Passo successivo’.

OptinMonster mostrerà quindi un riepilogo delle impostazioni delle tue 'Regole di visualizzazione'.

Questo aiuta a garantire che tu abbia impostato correttamente quando le tue campagne appariranno sul tuo sito web.

Ora sei pronto per rendere la tua campagna attiva e pubblicare il tuo popup del modulo di contatto.

Per fare ciò, vai alla scheda 'Pubblica' in alto. Quindi, fai clic sul pulsante 'Anteprima' per vedere come appare il tuo popup prima di andare online.

Quando sei soddisfatto dell'aspetto della tua campagna, cambia lo 'Stato di pubblicazione' da 'Bozza' a 'Pubblica'.

Una volta fatto, puoi uscire dal generatore di campagne OptinMonster e controllare lo stato della tua campagna dalla tua bacheca di WordPress.

Naviga su OptinMonster » Campagne e fai clic sul menu a discesa 'Stato'. Quindi, puoi cambiarlo da 'In attesa' a 'Pubblica'.

OptinMonster aggiornerà automaticamente le modifiche.

Successivamente, dovrai andare dove visualizzi il pulsante 'Contattaci' con l'integrazione MonsterLink e vedere il modulo di contatto popup in azione.

Ecco fatto!

Hai creato con successo un popup con modulo di contatto in WordPress. Ancora meglio, l'hai fatto in modo da mantenere il tuo modulo di contatto facile da accedere senza essere invadente.

Suggerimenti bonus per aumentare le tue iscrizioni tramite popup

Ora che sai come creare un popup per moduli di contatto, il passo successivo è assicurarsi che migliori l'esperienza utente invece di far rimbalzare i visitatori dal tuo sito.

Per massimizzare le iscrizioni, dovresti concentrarti sulla creazione di popup utili e pertinenti piuttosto che su quelli invadenti:

Combinando queste strategie, puoi creare popup che catturano l'attenzione, si connettono con il tuo pubblico e spingono all'azione senza risultare invadenti.

Per maggiori dettagli ed esempi, puoi consultare la nostra guida su come usare la psicologia dei popup per aumentare le iscrizioni del 250%.

Domande frequenti: Come aggiungere un popup per moduli di contatto in WordPress

Hai domande sui popup dei moduli di contatto? Ecco risposte rapide per aiutarti a configurarli nel modo giusto.

Come posso assicurarmi che il mio popup del modulo di contatto non sia fastidioso?

Tutto dipende dal tempismo e dal contesto. Per evitare di frustrare i visitatori, mostra i popup in base al comportamento, come dopo pochi secondi sulla pagina o quando qualcuno scorre verso il basso. Strumenti come OptinMonster ti permettono di perfezionare queste impostazioni in modo che il tuo popup sembri utile, non invadente.

Posso usare un popup con modulo di contatto per i visitatori da dispositivi mobili?

Sì, ma tieni presente lo spazio sullo schermo. WPForms e OptinMonster sono responsive per dispositivi mobili, il che significa che i tuoi popup si adatteranno a schermi più piccoli. Assicurati solo che il design sia pulito e facile da chiudere sui dispositivi mobili.

Come posso monitorare le prestazioni dei miei popup con modulo di contatto?

Puoi utilizzare MonsterInsights per monitorare metriche importanti dei moduli come visualizzazioni, clic e conversioni, tutto dalla tua dashboard di WordPress. Questo ti aiuta a capire cosa funziona e dove puoi migliorare.

Un popup con modulo di contatto rallenterà il mio sito?

Non se è costruito e configurato correttamente. Strumenti leggeri come WPForms e OptinMonster sono ottimizzati per le prestazioni, quindi non rallenteranno notevolmente il tuo sito se usati correttamente.

Tutorial video

Prima di andare, abbiamo preparato un tutorial video su come aggiungere un popup con modulo di contatto al tuo sito WordPress. Assicurati di dargli un'occhiata!

Esplora le nostre guide sui moduli WordPress

Speriamo che questo articolo ti abbia aiutato a imparare come aggiungere un popup con modulo di contatto in WordPress.

Successivamente, potresti anche voler consultare le nostre guide su:

• Come usare i moduli di contatto per far crescere la tua lista email in WordPress
• Come inviare email di conferma dopo l'invio di moduli WordPress
• Come monitorare e ridurre l'abbandono dei moduli
• Il modulo WordPress non funziona: suggerimenti per la risoluzione dei problemi
• La guida definitiva all'uso dei moduli WordPress

Se ti è piaciuto questo articolo, iscriviti al nostro canale YouTube per tutorial video su WordPress. Puoi anche trovarci su Twitter e Facebook.