A un certo punto, la maggior parte dei siti WordPress supera le basi. Devi gestire prenotazioni, raccogliere brief di progetto, consentire agli utenti di registrarsi a un evento, raccogliere feedback dopo un acquisto o accettare richieste di ordine con specifiche personalizzate. Ognuna di queste esigenze richiede un tipo diverso di modulo — campi differenti, logiche diverse, layout differenti — e WordPress non include un costruttore di moduli integrato che copra tutto.
Questo guida ti mostra come aggiungere un modulo in WordPress usando il Elfsight Form Builder – un editor visivo senza codice che funziona su qualsiasi setup WordPress senza l’installazione di plugin. Copriremo l’intero processo, dalla scelta del tipo di modulo all’incorporamento in una pagina attiva, insieme a metodi alternativi e a quando ciascuno ha più senso.
- Una panoramica completa con contesto decisionale a ogni passaggio
- Scenari aziendali comuni — e come configurare i moduli per ognuno
- Confronto onesto tra Elfsight e i metodi modulo nativi di WordPress
- Suggerimenti di ottimizzazione e FAQ reali dagli utenti di WordPress
Configurazione in 5 minuti: Aggiungi un modulo in WordPress
Se hai già chiaro cosa ti serve e vuoi mettere online subito, ecco la strada rapida per aggiungere moduli a WordPress in pochi passaggi:
- Apri l’editor del Costruttore di moduli e seleziona un modello
- Configura e personalizza il modulo
- Clicca “Aggiungi al sito” e copia il codice di incorporamento
- Incolla lo snippet nel backend di WordPress → Pubblica
🚀 Crea subito il tuo modulo WordPress nell’editor interattivo!
Quando (e perché) aggiungere moduli al tuo sito WordPress
Probabilmente non serve che spieghiamo perché i moduli sono utili — sei qui perché ne hai già bisogno. Ma il tipo di modulo che costruisci e dove lo posizioni contano altrettanto quanto i passaggi da seguire. Ecco le situazioni più comuni, con cosa dare priorità in ciascuna.
💬 Contatto e acquisizione di lead
Il punto di partenza più comune — un modulo di contatto, una newsletter o un modulo di lead generation su una landing page. La cosa che la maggior parte delle persone trascura: aggiungere un unico campo strutturato come un menu a discesa “Di cosa si tratta?” riduce ore di gestione della posta. Per la raccolta di lead senza una pagina dedicata, i moduli popup e i pannelli flottanti funzionano bene — si attivano al click di un pulsante o si posizionano ai bordi dello schermo senza togliere spazio prezioso della pagina.
📅 Prenotazioni, riservazioni e appuntamenti
Ristoranti, saloni, proprietà in affitto, consulenti — se la tua attività si basa su appuntamenti, un modulo di prenotazione evita le classiche telefonate. Raccogli gli elementi essenziali (data, orario, tipo di servizio, contatti) e resisti all’impulso di aggiungere campi che servono solo al tuo team interno ma irritano il visitatore.
💲 Ordini e donazioni
I moduli d’ordine coprono scenari in cui l’acquisto non è un semplice aggiungi al carrello — stampa personalizzata, catering, vendita all’ingrosso, pacchetti di servizi con opzioni configurabili. Abbina campi per l’upload di file quando i clienti devono allegare loghi o brief di design. I moduli di donazione sono strutturalmente semplici, ma i campi condizionali sono utili anche qui — mostra opzioni di frequenza ricorrente solo se il donatore acconsente.
📋 Feedback, recensioni e sondaggi
Campi di valutazione (stelle, scale numeriche, emoticon) più un eventuale campo commenti. Mantienili brevi — un modulo di feedback di 3 campi ottiene molto più risposte rispetto a uno di 10 campi. Se vuoi testimonianze strutturate da riutilizzare sul tuo sito, aggiungi nome, ruolo e una valutazione a stelle accanto al commento in modo da ottenere citazioni pubblicabili, non frasi vaghe.
📑 Registrazioni, adesioni e candidature
Iscrizioni agli eventi, moduli di adesione, domande di lavoro, ammissioni ai programmi — tendono a essere più lunghi, ed è qui che i layout a più passaggi hanno il loro valore. Dividere un modulo da 12 campi in tre passaggi con una barra di avanzamento riduce drasticamente l’abbandono. I moduli di candidatura traggono vantaggio dalla logica condizionale (mostra domande diverse in base al ruolo o al programma selezionato) e dai campi di caricamento file per CV o portfolio.
La complessità deve corrispondere alla decisione: l’iscrizione alla newsletter è un solo campo, un modulo di contatto ne ha tre, e una domanda di sovvenzione potrebbe richiedere quindici campi in quattro passaggi. Configura di conseguenza.
Ora costruiamo il modulo vero e proprio.
Guida passo-passo: come aggiungere un modulo in WordPress
Questa guida usa il Form Builder di Elfsight, che funziona interamente nel tuo browser — niente da installare su WordPress. Configuri tutto in un editor visivo, ottieni un codice di incorporamento e lo incolli sulla pagina.
Fase 1: Scegli un punto di partenza
Apri l’editor, e vedrai oltre 300 opzioni di template per diversi casi d’uso raggruppati in categorie. Il template che scegli non è un impegno vincolante — serve solo a precompilare l’editor con un set di campi rilevante. Puoi aggiungere, rimuovere o riordinare qualsiasi campo in seguito, quindi scegli quello più vicino a ciò di cui hai bisogno e personalizzalo da lì.
Passo 2: Crea il set di campi
Questo è il punto in cui il modulo prende forma. L’editor supporta più di 15 tipi di campo: campi di testo, informazioni di contatto, menu a discesa, caselle di controllo, pulsanti radio, selettori di data, caricamenti di file, scale di valutazione e altro ancora. Per ogni campo, imposta l’etichetta, il testo segnaposto, la descrizione e se è obbligatorio o facoltativo.
Alcune scelte che fanno la differenza qui:
Required vs. optional fields. Marca solo ciò di cui hai davvero bisogno. Ogni campo obbligatorio aumenta l’attrito. Se stai costruendo un modulo di contatto, nome e email sono obbligatori — anche il messaggio potrebbe esserlo. Numero di telefono? Rendi facoltativo a meno che tu non abbia effettivamente intenzione di contattare le persone.
Logica condizionale. Se il tuo modulo serve a più scopi, puoi mostrare campi di follow-up differenti in base alla scelta del visitatore. Per esempio, un modulo di prenotazione per uno studio fotografico potrebbe mostrare “Tipo di evento” e “Conteggio degli ospiti” solo quando il visitatore seleziona “Fotografia d’evento” dal menu a tendina dei servizi, mentre mostrando “Descrizione del prodotto” per richieste di servizi fotografici di prodotto. Abilita questa opzione per campo nelle impostazioni dell’editor.
Caricamenti di file. Utile per brief di design, curricula, immagini di riferimento o qualsiasi situazione in cui gli utenti devono allegare documenti. Tieni presente che chiedere caricamenti di file su un modulo di primo contatto crea attrito — valuta di renderlo facoltativo con una nota tipo “Allega file se rilevante.”
Fase 3: Aggiungi la navigazione a più passaggi (se il modulo è lungo)
Se il modulo ha più di cinque o sei campi, dividilo in passi. Vai alla scheda Layout se non hai ancora scelto un modello multi-step, quindi torna a Build Form per compilare ogni pagina separatamente. Ogni pagina diventa una fase separata con pulsanti Avanti e Indietro e una barra di avanzamento visiva che mostra lo stato di completamento.
Quando non serve un flusso a più passaggi: Moduli di contatto semplici (3–4 campi), iscrizioni alla newsletter e feedback rapidi funzionano meglio come un unico passaggio. Aggiungere passaggi a un modulo breve crea clic inutili.
Passo 4: Configura le notifiche email
Vai alla scheda Email tab per controllare cosa succede dopo che un visitatore invia il modulo. Qui imposti l’indirizzo email del destinatario (o più indirizzi — utile se sia vendite che supporto devono vedere determinati invii), l’oggetto e quali valori dei campi del modulo verranno inclusi nell’email di notifica.
Due impostazioni utili da configurare qui, che molti trascurano:
Risposta automatica al visitatore. Attiva questa funzione. Una conferma semplice tipo “Grazie, abbiamo ricevuto il tuo messaggio e risponderemo entro 24 ore” genera fiducia e riduce l’ansia del tipo “il mio modulo è stato inviato?”. Offre inoltre un punto naturale per impostare le tempistiche di risposta.
Oggetti personalizzati con i valori dei campi. Invece di una generica “Nuovo invio modulo,” inserisci il nome del visitatore o il tipo di richiesta nell’oggetto: “Nuova richiesta da {Name} — {Service Type}.” Quando ricevi 20 invii al giorno, la tua casella di posta è facilmente scansionabile senza aprire ogni email.
Passo 5: Scegli un layout e personalizza il design
Sotto Layout, vedrai due opzioni di incorporamento, che influenzeranno direttamente l’aspetto del tuo modulo sul sito:
- Predefinito (in linea) — Viene renderizzato direttamente nel contenuto della pagina in cui inserisci il codice di incorporamento. Ideale per pagine dedicate al modulo o per sezioni all’interno di una pagina di destinazione.
- Pannello flottante — Un modulo appiccicoso che scivola dall’angolo dello schermo. Ideale per moduli “richiedi una richiamata” o “richiedi un preventivo” che devono essere accessibili da qualsiasi punto di scorrimento senza occupare spazio sulla pagina.
Per l’opzione inline, puoi scegliere tra tre layout di campi: verticale, orizzontale e a più passaggi (secondo la navigazione).
Una volta deciso il posizionamento, passa a Appearance per affinare colori, font, spaziatura dei campi, stile dei pulsanti e raggio di curvatura dei bordi per abbinare il tema WordPress. Se le linee guida del tuo marchio richiedono uno stile specifico oltre le opzioni integrate, usa il campo CSS personalizzato.
Passo 6: Configura cosa succede dopo l’invio
Oltre alle notifiche via email, scegli cosa vedono i visitatori dopo aver premuto Invia. Due opzioni:
- Messaggio di ringraziamento inline — Una conferma compare direttamente all’interno del modulo. Semplice e mirato. Funziona per i moduli nella barra laterale o nel piè di pagina, dove rimandare a una nuova pagina risulterebbe invasivo.
- Reindirizza a un URL — Inoltra i visitatori a una pagina di ringraziamento dedicata dopo l’invio.
Passo 7: Collega integrazioni (Opzionale)
Se le invii del modulo devono fluire verso altri strumenti, apri la scheda Integrazioni. Il Form Builder supporta connessioni dirette a:
- Google Sheets — Invia automaticamente ogni invio in un foglio di calcolo. Utile se il tuo team sta già monitorando lead, ordini o registrazioni in Sheets e non vuole esportare CSV manualmente.
- Mailchimp — Invia direttamente le iscrizioni via email e le sottoscrizioni della newsletter al tuo pubblico Mailchimp, con mappatura dei campi per segmenti e tag.
- Zapier / Make.com — Collega a oltre 5.000+ app. Invia le risposte al tuo CRM, crea schede Trello dai moduli di intake dei progetti, attiva notifiche Slack per nuove prenotazioni — qualunque cosa serva al tuo flusso di lavoro.
- Webhooks — Per configurazioni personalizzate: invia i dati grezzi del modulo a qualsiasi endpoint che controlli.
Puoi saltare completamente questo passaggio se le notifiche via email bastano alle tue esigenze, e tornare più avanti per configurare le integrazioni senza reinserire il modulo.
Passaggio 8: Incorpora il modulo nella tua pagina WordPress
Una volta configurato il modulo, fai clic su “Add to Website” per generare il codice di installazione.
Ecco come inserire un modulo in WordPress:
- Accedi al backend di WordPress e vai su Pagine, quindi apri la pagina di destinazione per modificarla.
- Nell’Editor a blocchi, fai clic sull’icona + per aggiungere un nuovo blocco.
- Cerca e seleziona HTML personalizzato.
- Incolla l’intero codice di installazione Elfsight nel blocco.
- Clicca su Pubblica o Aggiorna.
Il tuo modulo apparirà subito sulla pagina live.
Per aggiungere il tuo modulo in tutto il sito (ad es. nella barra laterale o nel piè di pagina), vai su Aspetto → Widget, aggiungi un widget HTML personalizzato nell’area desiderata, incolla il codice di installazione e salva.
Help Center guide.”>Per i siti WordPress che usano Elementor, trascina sull pagina l’elemento HTML (non “HTML personalizzato”) e incolla il codice. Per istruzioni dettagliate specifiche per la piattaforma, consulta la nostra Guida del Centro assistenza.
Altri modi per aggiungere moduli su WordPress
Elfsight non è l’unico modo per integrare un modulo in WordPress: a seconda della tua situazione, un approccio diverso potrebbe essere più adatto. Ecco una valutazione onesta.
WPForms o Contact Form 7 (Plugin WordPress)
L’approccio più comune. WPForms ti offre un builder drag-and-drop all’interno della dashboard di WordPress; Contact Form 7 è un’alternativa leggera, orientata al codice, presente sin dal 2007.
- Vai su Plugin → Aggiungi nuovo nel pannello di controllo di WordPress.
- Cerca “WPForms” (o “Contact Form 7”) e installa/attiva.
- Crea un nuovo modulo usando l’editor integrato del plugin.
- Incorpora il modulo in una pagina con lo shortcode o il blocco del plugin.
Quando questa è la scelta migliore: Se vuoi gestire tutto all’interno di WordPress e sei a tuo agio con la gestione dei plugin, WPForms è uno strumento affidabile con logica condizionale, moduli a più passaggi e integrazioni di pagamento. Contact Form 7 è difficile da battere se sei uno sviluppatore in cerca di una soluzione minimale e gratuita e non ti dispiace scrivere CSS.
Modulo HTML manuale
Per sviluppatori a proprio agio con il codice, puoi creare un modulo usando HTML puro e gestire gli invii tramite uno script PHP personalizzato o un endpoint di terze parti come Formspree.
- Aggiungi un blocco HTML personalizzato alla tua pagina nell’Editor a blocchi.
- Scrivi il markup HTML
<form>con i campi desiderati. - Imposta l’attributo
actionsul file gestore PHP o su un servizio esterno. - Stilizza con CSS nel Customizer del tema o nel foglio di stile del tema figlio.
Quando questa è la scelta migliore: Se hai bisogno di controllo totale sull’HTML e sul comportamento, o se il tuo modulo si integra con un backend personalizzato. Utile anche per moduli molto semplici (uno o due campi) dove un widget completo o un plugin è eccessivo.
Google Forms (Incorpora tramite iframe)
forms.google.com, grab the embed code, and paste it into a Custom HTML block.”>Gratuito, veloce e non richiede alcuna competenza tecnica. Crea un modulo su forms.google.com, procurati il codice di incorporamento e incollalo in un blocco HTML personalizzato.
Quando questa è la scelta migliore: Sondaggi interni, sondaggi rapidi o qualsiasi situazione in cui non ti interessa l’integrazione visiva con il tuo sito. Google Forms è anche l’opzione più semplice se lavori già con Google Workspace e vuoi che le risposte fluiscano automaticamente in Google Sheets.
Confrontiamo gli strumenti
La versione breve: se vuoi funzionalità avanzate dei moduli senza appesantire plugin o codice, Elfsight le copre. Se vuoi tutto all’interno dell’ecosistema WordPress e non ti dispiace pagare per le funzionalità Pro, WPForms è una scelta solida. Se il tuo modulo è semplice e interno, Google Forms o un modulo HTML manuale potrebbe bastare.
| Caratteristica | Elfsight Form Builder | WPForms / CF7 | HTML manuale | Google Forms |
|---|---|---|---|---|
| Nessun codice necessario | ✓ | ✓ (WPForms) / (CF7) ⚠ | x | ✓ |
| Moduli a più passaggi | ✓ | ✓ (WPForms Pro) | (creazione manuale) | x |
| Logica condizionale | ✓ | ✓ (WPForms Pro) | (creazione manuale) | Base ⚠ |
| Personalizzazione completa del design | ✓ | ⚠ Dipende dal tema | ✓ (CSS manuale) | x |
| Nessuna installazione di plugin necessaria | ✓ | x | ✓ | ✓ |
| Notifiche e-mail integrate | ✓ | ✓ | Impostazione manuale | ✓ (tramite Sheets) |
| Popup / layout flottanti | ✓ | x (richiede un componente aggiuntivo) | x | x |
| Funziona anche al di fuori di WordPress | ✓ | x | ✓ | ✓ |
Consigli di ottimizzazione per il tuo modulo WordPress
Il tuo modulo è online — ora verifica che funzioni davvero. La maggior parte dell’abbandono dei moduli è dovuta a pochi errori correggibili.
- Riduci al minimo i campi inutili. Se il tuo team non userà un dato entro 48 ore, non chiederlo. Puoi sempre raccoglierne di più in un follow-up.
- Usa un flusso a più passaggi per 6 o più campi. Suddividi i moduli più lunghi in passaggi con una barra di avanzamento. Metti in primo piano i campi facili (nome, email) nel primo passaggio — l’impegno iniziale aiuta a far proseguire i visitatori.
- Testa su mobile prima di pubblicare. Verifica che i menu a discesa, i selettori di date e il pulsante di invio funzionino sui telefoni reali. La maggior parte del traffico WordPress è mobile.
- Allinea il design al tuo tema. Estrai codici esadecimali esatti e nomi dei font dal tema WordPress e applicali nell’editor. Due minuti di lavoro, una differenza di fiducia evidente.
- Reindirizza a una pagina di ringraziamento. Questo consente di tracciare le conversioni mirate in Google Analytics — cosa che i messaggi di conferma inline non possono fare con la stessa precisione.
- Rivedi le invii settimanali. Cerca schemi: dove i visitatori si fermano nei moduli a più passaggi, quali campi ricevono risposte di bassa qualità e quali moduli hanno il maggior volume.
FAQ (Domande frequenti)
Come aggiungere un modulo a una pagina WordPress senza plugin?
Posso aggiungere un modulo su WordPress che funzioni anche su mobile?
Come incorporare un modulo in WordPress se uso Elementor?
Perché non ricevo notifiche email dalle invii del modulo?
Considerazioni finali
Ora hai tutto il necessario per aggiungere un modulo al tuo sito WordPress — dall’inserimento in quattro passaggi a una guida completa sulla configurazione dei campi, layout a più passaggi, notifiche e design. Più importante, sai esattamente quali decisioni contano in ogni passaggio e come configurarle per il tuo caso d’uso specifico, che si tratti di un semplice modulo di contatto o di un modulo di intake progetto a più passaggi.
Se sei pronto per iniziare, apri Elfsight Form Builder e provalo gratuitamente. Scegli un modello, configura i campi e avrai un modulo funzionante sulla tua pagina WordPress in pochi minuti.
