La maggior parte delle piccole imprese commette un errore cruciale: utilizza moduli di iscrizione piuttosto standard che assomigliano a tutti gli altri moduli di iscrizione presenti sul web.
Questo schema si ripete ogni volta che abbiamo la possibilità di controllare i moduli dei nostri clienti mentre rispondiamo alle loro domande.
Abbiamo quindi voluto mettere insieme una guida rapida per aiutare i nostri lettori a creare moduli di iscrizione di grande effetto per costruire la vostra lista di newsletter.
In questa guida vi illustreremo i passaggi per creare il vostro modulo di iscrizione personalizzato utilizzando il più popolare strumento di page builder per WordPress: Elementor.
Creare moduli di iscrizione personalizzati in Elementor
Creare un modulo di iscrizione personalizzato in Elementor
Utilizzate i collegamenti rapidi qui sotto per passare immediatamente a qualsiasi sezione dell'esercitazione:
In questo articolo
- Passo 1: Installare Elementor e WPForms
- Passo 2: Creare o modificare una pagina con Elementor
- Passo 3: Creare un nuovo modulo di iscrizione
- Passo 4: Collegare il modulo di iscrizione con una piattaforma di marketing
- Fase 5: Creare il modulo di iscrizione e pubblicarlo
- Domande frequenti sui moduli di iscrizione di Elementor
Cominciamo.
Passo 1: Installare Elementor e WPForms
Poiché la maggior parte delle persone utilizza Elementor per pubblicare le proprie pagine, vi mostreremo come creare moduli di iscrizione personalizzati utilizzando Elementor.
Se non lo avete già, installate Elementor sul vostro sito.
Per questo tutorial non è necessaria una licenza premium di Elementor. Invece, potete usare Elementor insieme a WPForms per costruire moduli di iscrizione gratuitamente! 😎
Se non sapete come installare i plugin, date un'occhiata a questa guida per principianti sull'installazione dei plugin.
Sebbene sia possibile costruire moduli di iscrizione personalizzati di bell'aspetto utilizzando una combinazione di Elementor e WPForms in modo completamente gratuito, consigliamo di provare la licenza WPForms Pro per accedere ad alcuni strumenti avanzati per ottenere risultati migliori.
Dopo aver installato entrambi i plugin, è il momento di iniziare a creare il vostro modulo di iscrizione completamente personalizzato!
Passo 2: Creare o modificare una pagina con Elementor
È possibile aggiungere un modulo di iscrizione a una pagina esistente o a una pagina nuova. Di solito, un modulo per la newsletter viene incorporato come una delle varie sezioni di una landing page più grande. Ma per semplicità creeremo una nuova pagina contenente solo un modulo di iscrizione.
Per iniziare, aprire la dashboard di WordPress e fare clic su Pagine " Aggiungi nuova pagina.
Una volta entrati nell'editor di blocchi di WordPress, fare clic sul pulsante Modifica con Elementor in alto.
Dopo aver fatto clic sul pulsante, l'editor di Elementor si caricherà in pochi secondi. È possibile costruire una landing page completa utilizzando l'editor drag and drop.
Nel prossimo passo, utilizzeremo il widget WPForms per creare un modulo di iscrizione personalizzato.
Passo 3: Creare un nuovo modulo di iscrizione
Poiché dobbiamo aggiungere un modulo di iscrizione personalizzato, cerchiamo il widget WPForms e trasciniamolo nell'area a destra.
Una volta inserito il widget WPForms nella pagina, è possibile selezionare qualsiasi modulo salvato con WPForms o crearne uno nuovo.
Creeremo un nuovo modulo di iscrizione facendo clic sul pulsante + Nuovo modulo nel riquadro di sinistra.
A questo punto, il costruttore di moduli WPForms inizierà a caricarsi in sovraimpressione. Qui è possibile creare il modulo di iscrizione da incorporare nella pagina.
Iniziate a dare un nome al vostro modulo. Questo è utile per poterlo consultare e trovare in seguito nella dashboard di WordPress.
Quindi, scorrere verso il basso e utilizzare la barra di ricerca sotto il riquadro di selezione dei modelli per trovare un modello adatto. Per questa esercitazione utilizzeremo il modello Modulo di iscrizione alla newsletter.
Dopo aver selezionato il modello, il costruttore di moduli verrà caricato sullo schermo. Si noterà che questo modello include già i campi Nome e Email, che sono praticamente tutto ciò che serve per l'iscrizione alla newsletter.
Ma il divertimento non si ferma qui! Possiamo portare questa forma al livello successivo e darle un vero e proprio splendore.
Uno dei modi per farlo è aggiungere un titolo divertente che inviti più persone a iscriversi.
È possibile farlo utilizzando il campo Contenuto disponibile in WPForms Pro. Inseriamo il campo Contenuto all'inizio del modulo.
Dopo aver aggiunto il campo, fare clic su di esso per aprire le Opzioni di campo associate nel riquadro di sinistra.
L'editor di testo nel riquadro di sinistra consente di aggiungere qualsiasi pezzo di testo senza alcun codice. Aggiungeremo del testo e lo formatteremo come Titolo 4. Aggiungiamo anche un'emoji per far risaltare maggiormente il testo! 🕺
Assicurarsi di premere il pulsante Anteprima aggiornamento sotto l'editor per vedere le modifiche apportate al modulo sulla destra.
E già che ci siamo, cambiamo anche il testo del pulsante di invio e rendiamolo più pertinente alla natura del modulo.
Dalla barra laterale del costruttore di moduli, fare clic su Impostazioni " Generale. Scorrere verso il basso fino a trovare il campo Testo del pulsante di invio. È possibile sostituire il testo predefinito semplicemente digitandolo qui.
Ottimo! Il modulo sta già prendendo forma. È il momento di salvare il modulo premendo Salva in alto.
Ma un modulo di iscrizione alla newsletter non avrebbe senso se non fosse integrato con il vostro strumento di email marketing.
Nella fase successiva, vi mostreremo come integrare il modulo con la vostra app di marketing, in modo che i nuovi iscritti vengano automaticamente copiati nella vostra lista di abbonati.
Passo 4: Collegare il modulo di iscrizione con una piattaforma di marketing
WPForms supporta diverse integrazioni di marketing a partire dai piani Plus e superiori. Se utilizzate WPForms Lite, potete comunque accedere gratuitamente all'integrazione con Constant Contact.
In questo esempio, vi mostreremo rapidamente come collegare il vostro modulo di iscrizione con Brevo.
Basta andare nella scheda Marketing della barra laterale.
Quindi, selezionare il servizio con cui si desidera collegare il modulo. Ad eccezione di Constant Contact, tutte le integrazioni di marketing supportate richiedono l'installazione del relativo addon.
Se non avete già l'addon, WPForms lo installerà per voi quando lo cliccherete.
In questo caso, stiamo usando Brevo. Facendo clic su Brevo nella scheda Marketing, ci è stato chiesto di installarlo. Dopo aver premuto Sì, installa e attiva, sono bastati 5 secondi perché l'addon Brevo fosse installato e pronto.
Quindi, con Brevo selezionato nel riquadro di sinistra, fate clic su Aggiungi nuovo account in alto a destra.
Ora è sufficiente inserire la chiave API Brevo e il nickname dell'account. Se avete bisogno di aiuto per trovare la vostra chiave API Brevo, consultate il nostro documento sull'addon Brevo per maggiori dettagli.
Dopo aver inserito le informazioni richieste, fare clic su Aggiungi.
Una volta collegati al vostro account Brevo, nel riquadro di destra apparirà un nuovo elenco di impostazioni.
Utilizzate i campi a discesa per configurare il funzionamento del modulo con il vostro account Brevo. È possibile impostare cose come l'azione da eseguire in Brevo quando il modulo viene inviato, l'elenco in cui i nuovi iscritti devono essere aggiunti o rimossi, la mappatura dei campi e-mail e altro ancora.
Una volta terminato, assicurarsi di premere Salva in alto.
L'integrazione del marketing è ora completa. È stato facile, non è vero?
Fase 5: Creare il modulo di iscrizione e pubblicarlo
A questo punto, abbiamo finito di impostare le funzionalità necessarie per il modulo di iscrizione. Ma, come abbiamo sottolineato all'inizio di questo tutorial, un modulo d'impatto non deve essere solo funzionale, ma anche di grande impatto visivo.
Sebbene abbiamo già reso il nostro modulo molto più eccitante aggiungendo del testo e delle emoji con il campo Contenuto, possiamo andare oltre con la potenza combinata di WPForms ed Elementor.
Dopo che il modulo è pronto, è sufficiente uscire da WPForms premendo il pulsante con la croce. Ora si dovrebbe avere l'editor di Elementor con il modulo appena creato incorporato come widget.
Fare clic sul modulo e selezionare la scheda Stili nel riquadro di sinistra.
In questa scheda si trovano le opzioni per personalizzare gli stili dei diversi componenti del modulo. Ad esempio, è possibile personalizzare gli stili dei campi, delle etichette e dei pulsanti senza alcun codice.
Nel nostro modulo, i bordi dei campi sono rettangolari con angoli diritti per impostazione predefinita. Ma se si desiderano bordi di campo più arrotondati, è sufficiente aumentare il valore del raggio del bordo in Stili campo.
Allo stesso modo, è possibile cambiare il colore dei campi, delle etichette e dei pulsanti con un solo clic. Utilizzeremo i colori predefiniti perché si adattano perfettamente al nostro tema. Ma siete liberi di sperimentare colori diversi per il vostro modulo.
In Elementor è anche possibile modificare gli stili del contenitore del modulo. Per farlo, fare clic sulla scheda Avanzate.
Qui troverete una serie di impostazioni affascinanti, tra cui regolazioni del layout, effetti di animazione, personalizzazione dello sfondo e altro ancora.
Aggiungiamo un colore di sfondo al contenitore del modulo per dargli un aspetto più vivace. Fare clic sull'opzione Sfondo per espandere il menu con le impostazioni aggiuntive.
Aggiungiamo un colore solido facendo clic sull'icona di selezione del colore a destra.
Lo strumento di selezione dei colori consente di selezionare comodamente qualsiasi colore con un clic.
Dopo aver selezionato il colore, il modulo appare immediatamente molto più attraente!
Tuttavia, gli elementi all'interno del modulo toccano i bordi del contenitore, il che non è molto bello.
Si tratta di una soluzione semplice!
Fare clic sull'opzione Layout nel menu Avanzate del pannello di sinistra per accedere alle impostazioni di margine e padding. Abbiamo semplicemente aggiunto un po' di padding e i risultati sono ottimi!
A questo punto, siamo pronti a pubblicare il modulo. Ma se si desidera provare ulteriori personalizzazioni, si può dedicare più tempo a esplorare le diverse opzioni.
Quando si è pronti, premere il pulsante Pubblica in basso.
Verrà immediatamente visualizzato un messaggio che chiede se si desidera visualizzare la pagina pubblicata.
Dopo la pubblicazione, visualizzare la pagina.
E questo è quanto!
Avete appena aggiunto un modulo di iscrizione personalizzato utilizzando Elementor e WPForms.
In questo modo, potete assicurarvi che il vostro modulo abbia un aspetto unico per il vostro sito web e che sia dotato di integrazioni che fanno risparmiare tempo, per aiutarvi a far crescere gli iscritti alle vostre e-mail senza alcun problema!
Domande frequenti sui moduli di iscrizione di Elementor
Avete ancora qualche domanda sulla creazione di moduli di iscrizione in Elementor? Ecco alcune domande che i nostri clienti ci hanno già posto.
Ho bisogno di Elementor Pro per creare un modulo di iscrizione?
No, non è necessario Elementor Pro per creare un modulo di iscrizione, purché sia installato WPForms. È possibile accedere al widget WPForms in Elementor senza dover passare alla versione Pro. Tuttavia, Elementor ha anche un proprio costruttore di moduli. Se si desidera creare moduli di iscrizione solo con Elementor, è necessaria una licenza Pro.
Mentre Elementor è un fantastico strumento per la creazione di pagine, il costruttore di moduli di Elementor è più elementare e presenta diverse limitazioni rispetto ai costruttori di moduli avanzati come WPForms.
Come posso adattare il mio modulo di iscrizione al branding del mio sito web?
Il modo più semplice per abbinare i moduli di iscrizione al branding del sito è quello di utilizzare i colori del tema del sito per i diversi aspetti del modulo. WPForms sceglie automaticamente i colori primari e secondari del tema, in modo da poterli utilizzare facilmente per i diversi componenti del modulo, come i bordi, le etichette e i pulsanti.
È possibile accedere a queste impostazioni di personalizzazione dello stile nel widget Elementor WPForms facendo clic sulla scheda Stile. Lì troverete l'opzione per cambiare il colore di diverse parti del vostro modulo, scegliendo tra i colori del tema disponibili per abbinare il vostro marchio. Non è necessario alcun codice!
Posso utilizzare un CSS personalizzato per creare lo stile del mio modulo di iscrizione?
Sì, è possibile aggiungere classi CSS personalizzate al modulo di iscrizione se si utilizza WPForms. Per farlo, dopo aver selezionato il widget WPForms in Elementor, cliccare su Stile e poi su Avanzate. È quindi possibile inserire CSS personalizzati per lo stile del modulo di iscrizione.
Come posso creare un modulo di iscrizione in più fasi?
WPForms offre diversi modi per creare un modulo di iscrizione in più fasi. Si possono aggiungere interruzioni di pagina per suddividere il modulo in più pagine, oppure si può usare l'addon Lead Forms, che trasforma automaticamente un modulo normale in un modulo di iscrizione in più fasi con interruzioni di pagina.
Quindi, creare un modulo ConvertKit personalizzato
WPForms si integra con diverse piattaforme di marketing, tra cui ConvertKit. Abbiamo una guida dedicata che vi mostra come creare un modulo ConvertKit personalizzato. Date un'occhiata!
Potete anche confrontare le opzioni di modulo d'ordine gratuito se vendete prodotti online.
Creare moduli di iscrizione personalizzati in Elementor
Siete pronti a creare il vostro modulo di iscrizione personalizzato? 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.
