Come creare un modulo di registrazione utente personalizzato in WordPress

Se gestite un sito di membership su WordPress o un altro sito web che consente la registrazione degli utenti, è molto importante che la registrazione avvenga senza problemi. Tuttavia, il modulo predefinito di WordPress per la registrazione degli utenti è un po’ elementare.

Poiché questo modulo predefinito non ha opzioni personalizzate e visualizza il brand di WordPress, può entrare in conflitto con il design del sito web.

Noi di WPBeginner siamo consapevoli dell’importanza di mantenere un brand coerente in tutti i punti di contatto, compresa la registrazione degli utenti.

Aggiungendo un modulo di registrazione personalizzato, potete migliorare l’esperienza dell’utente per i nuovi visitatori, garantire un’identità di brand coesa e persino aumentare le registrazioni degli utenti sul vostro sito web WordPress.

Questo articolo vi guiderà attraverso il processo di creazione di moduli di registrazione frontend personalizzati in WordPress.

Perché aggiungere un modulo di registrazione utente personalizzato in WordPress?

La pagina di registrazione utente di WordPress predefinita mostra il marchio e il logo di WordPress, che non si abbina al resto del design del vostro sito web WordPress.

La creazione di un nuovo modulo di registrazione utente consente di aggiungere il modulo di registrazione a qualsiasi pagina del sito e aiuta a fornire un’esperienza utente più coerente durante il processo di registrazione.

Con un modulo di registrazione, potete raccogliere informazioni specifiche dai vostri utenti che possono essere uniche per il vostro blog o la vostra azienda WordPress.

Questo può includere ulteriori dettagli di contatto, preferenze o qualsiasi altra informazione rilevante per la funzionalità del vostro sito.

Ad esempio, se state organizzando un evento, un modulo di registrazione vi aiuterà a raccogliere i dati essenziali dei partecipanti, come le restrizioni alimentari, le preferenze per le sessioni o le esigenze speciali.

Un modulo di registrazione utente personalizzato consente anche di reindirizzare gli utenti al momento della registrazione. È anche possibile visualizzare campi aggiuntivi per il profilo dell’utente, combinarli con un modulo di accesso front-end personalizzato e collegarlo al vostro servizio di email marketing.

Detto questo, vediamo come creare un modulo di registrazione utente personalizzato in WordPress, passo dopo passo.

Come creare un modulo di registrazione utente personalizzato in WordPress

Il modo più semplice per creare un modulo personalizzato per la registrazione degli utenti è utilizzare WPForms. È il miglior plugin per moduli di contatto di WordPress che consente di creare tutti i tipi di nuovi moduli in WordPress.

WPForms è molto facile da usare e offre un costruttore di moduli drag-and-drop, in modo da poter personalizzare il modulo di registrazione come si desidera. Il plugin si integra anche con i più diffusi servizi di email marketing e di pagamento come PayPal.

Per prima cosa, è necessario installare e attivare il plugin WPForms. Per istruzioni più dettagliate, consultate la nostra guida passo passo su come installare un plugin di WordPress.

Dopo l’attivazione, andate alla pagina WPForms ” Impostazioni dalla barra laterale dell’amministrazione di WordPress per inserire la vostra chiave di licenza.

È possibile ottenere questa chiave dal proprio account sul sito web di WPForms.

Una volta verificata la chiave, è necessario visitare la pagina WPForms ” Addons dalla dashboard di WordPress.

Da qui, individuare “User Registration Addon” e fare clic sul pulsante “Install Addon” sotto di esso.

WPForms installerà e attiverà l’addon per la registrazione degli utenti sul vostro sito WordPress. Vedrete lo stato cambiare in “Attivo” quando l’addon è installato.

Ora siete pronti a creare il vostro modulo di registrazione utente personalizzato.

Per farlo, visitare la pagina WPForms ” Aggiungi nuovo dalla barra laterale dell’amministrazione.

Si accede così alla pagina “Seleziona un modello”, dove si può iniziare a digitare un nome per il modulo che si sta per creare.

Una volta fatto ciò, è sufficiente individuare il modello “Modulo di registrazione utente” e fare clic sul pulsante “Usa modello” sotto di esso.

Questo avvierà il costruttore di moduli WPForms sullo schermo. Noterete le opzioni dei campi nella colonna di destra e l’anteprima del modulo nell’angolo sinistro dello schermo.

Ora, il modulo di registrazione predefinito avrà già aggiunto i campi nome, nome utente, password, e-mail e breve biografia.

Tuttavia, è possibile aggiungere facilmente altri campi al modulo dal pannello di sinistra e trascinare i campi per riorganizzarne l’ordine.

Il plugin consente anche di modificare ogni campo del modulo. Per farlo, è sufficiente fare clic su qualsiasi campo del modulo e vedrete apparire le “Opzioni del campo” nella colonna di sinistra.

Da qui è possibile cambiare l’etichetta del campo, modificarne il formato, aggiungere una descrizione, impostare la formattazione condizionale, modificare il campo in obbligatorio e altro ancora.

Una volta terminato, non dimenticate di fare clic sul pulsante “Salva” per memorizzare le impostazioni.

Nota: se volete inviare notifiche via e-mail agli utenti registrati, potete consultare il nostro tutorial su come inviare e-mail di conferma dopo l’invio di un modulo WordPress.

Aggiunta di campi personalizzati nel modulo di registrazione utente personalizzato

WPForms consente anche di collegare i campi del profilo utente personalizzato al modulo di registrazione dell’utente.

A tal fine, è necessario aggiungere ulteriori campi per il profilo dell’utente al sito WordPress e il modo più semplice per farlo è utilizzare un plugin per WordPress.

In questo tutorial, utilizziamo il plugin Advanced Custom Fields. Tuttavia, la funzione di mappatura dei campi di WPForms funziona con qualsiasi plugin che utilizza i campi personalizzati standard di WordPress per aggiungere e memorizzare i metadati degli utenti.

Innanzitutto, è necessario installare e attivare il plugin Advanced Custom Fields. Per maggiori dettagli, potete consultare la nostra guida per principianti su come installare un plugin di WordPress.

Dopo l’attivazione del plugin, andare alla pagina ACF ” Gruppi di campi dalla barra laterale dell’amministrazione di WordPress. Qui, fare clic sul pulsante “+ Aggiungi gruppo di campi”.

Si accede così alla pagina “Aggiungi nuovo gruppo di campi”, dove si può iniziare a digitare un titolo per il gruppo di campi.

In questa esercitazione, creeremo un campo personalizzato per i dettagli degli account dei social media.

Successivamente, scorrere il menu a discesa “Tipo di campo” e scegliere un tipo di campo personalizzato. È possibile selezionare testo, numeri, immagini, file, caselle di controllo, URL, password e molto altro.

Una volta fatto ciò, inserire un’etichetta di campo che apparirà nella pagina del profilo.

Ad esempio, se si vuole aggiungere un campo personalizzato per raccogliere i profili di Facebook, si può assegnare al campo il nome “Facebook”.

Si noterà che il nome del campo viene generato automaticamente quando si inserisce l’etichetta del campo, ma è possibile modificarlo.

Passare quindi alla scheda ‘Convalida’ dalla sezione ‘Etichetta’. Qui si può attivare l’interruttore ‘Richiesto’ per rendere obbligatoria la compilazione di questo campo personalizzato da parte degli utenti prima di inviare il modulo.

Da qui si può anche impostare un limite di caratteri per il campo.

Una volta fatto questo, basta passare alla scheda “Presentazione” dall’alto.

È ora possibile aggiungere istruzioni per gli autori, testo segnaposto per il campo, attributi wrapper e altro ancora.

Successivamente, è possibile aggiungere una logica condizionale al campo personalizzato che si sta creando, passando alla scheda “Logica condizionale” dall’alto.

Una volta apportate le modifiche, scorrere fino alla sezione “Regole di localizzazione”. Da qui è necessario creare una serie di regole per determinare quali schermate utilizzeranno i campi personalizzati.

Poiché vogliamo che questo campo appaia per tutti i profili utente, dovremo selezionare l’opzione “Ruolo utente” dal menu a discesa a sinistra.

Quindi, lasciate il menu a tendina al centro così com’è e scegliete l’opzione “Tutti” dal menu a tendina a destra.

Ora, il gruppo di campi personalizzati che stiamo creando sarà visualizzato per tutti i profili utente.

Quindi, passare alla scheda “Impostazioni gruppo” dall’alto.

Una volta arrivati a questo punto, assicurarsi che il gruppo di campi sia attivo facendo scorrere la levetta da No a Sì.

Una volta fatto questo, è possibile aggiungere altri campi personalizzati al gruppo di campi facendo clic sul pulsante “Aggiungi campo” nella parte superiore della pagina.

Ad esempio, se si desidera creare più campi per i social media, è possibile fare clic sul pulsante “Aggiungi campo” e iniziare a personalizzare il campo per altre piattaforme di social media.

Tenere presente che tutti i campi creati faranno parte dello stesso gruppo di campi.

Una volta terminato, non dimenticate di fare clic sul pulsante “Salva modifiche” in alto per memorizzare le impostazioni.

Il gruppo di campo è stato pubblicato con successo.

Ora, per visualizzare il campo personalizzato creato, andare alla pagina Utente ” Profilo dall’area di amministrazione.

Qui si vedranno i campi personalizzati aggiunti in fondo alla pagina del profilo.

Ora che avete creato un campo profilo utente personalizzato, dovrete aggiungerlo al modulo di registrazione utente personalizzato in WPForms.

Dopodiché, dovrete anche assicurarvi di mappare il campo del modulo sul campo personalizzato, in modo che i dati siano memorizzati correttamente.

Per farlo, visitate la pagina WPForms ” Tutti i moduli dalla dashboard di WordPress. Quindi, fare clic sul link “Modifica” sotto il modulo di registrazione dell’utente appena creato e salvato.

Questo aprirà il vostro modulo nel costruttore di moduli di WPForms. Una volta lì, è sufficiente trascinare un campo dal pannello di sinistra per aggiungerlo al modulo.

In questo esempio, stiamo aggiungendo un campo “Sito web/URL” al nostro modulo.

Dopo aver aggiunto il campo Sito web/URL, fare clic su di esso per aprire le proprietà del campo nella colonna di sinistra.

A questo punto, cambiare l’etichetta del campo da Website/URL al nome del gruppo di campi creato.

Se si desidera, si può anche aggiungere una descrizione per il campo.

Dopodiché, non dimenticate di fare clic sul pulsante “Salva” per salvare il modulo.

Successivamente, è necessario fare clic sul pulsante “Impostazioni” nell’angolo destro per le impostazioni avanzate del modulo e la mappatura dei campi. Nella pagina delle impostazioni, fare clic sulla scheda “Registrazione utente”.

WPForms mostrerà ora i campi del modulo e un menu a discesa sotto di essi per selezionare il campo di registrazione di WordPress con cui mapparlo.

Si noterà che WPForms mapperà automaticamente i campi predefiniti come Nome, Email, Password e altri.

Da qui, scegliere l’opzione del nome del gruppo di campi dal menu a discesa sotto l’opzione “Sito web”.

Quindi, scorrere verso il basso fino alla sezione “Meta utente personalizzato”.

È possibile inserire il nome del gruppo di campi creato in precedenza nell’opzione meta-chiave personalizzata e poi selezionare il campo del modulo personalizzato con cui si desidera mapparlo dal menu a discesa.

Nota: se volete inviare notifiche via e-mail agli utenti registrati, potete consultare il nostro tutorial su come inviare e-mail di conferma dopo l’invio di un modulo WordPress.

Infine, fare clic sul pulsante “Salva” nell’angolo superiore destro dello schermo per salvare le impostazioni.

Aggiunta del modulo di registrazione utente personalizzato in WordPress

WPForms rende semplicissimo aggiungere moduli ai post, alle pagine e ai widget della barra laterale di WordPress.

Per prima cosa, è necessario aprire una pagina esistente o una nuova pagina in cui si desidera aggiungere il modulo di registrazione personalizzato.

Una volta lì, fare clic sul pulsante “Aggiungi blocco” (+) in alto a sinistra per aprire il menu dei blocchi.

Da qui, individuare e aggiungere il blocco WPForms alla pagina/post.

Successivamente, è possibile selezionare il modulo di registrazione personalizzato dal menu a discesa del blocco stesso.

Ora vedrete l’anteprima del vostro modulo di registrazione nell’editor di WordPress. Procedete con la pubblicazione del post o della pagina per vedere il modulo di registrazione personalizzato in azione.

Aggiungere il modulo di registrazione utente personalizzato alla barra laterale

WPForms consente anche di aggiungere un modulo personalizzato per la registrazione degli utenti nella barra laterale. Basta visitare la pagina Aspetto ” Widget dall’area di amministrazione e fare clic sul pulsante ‘Aggiungi blocco’ (+).

Si aprirà il menu dei blocchi, dal quale è possibile aggiungere il blocco WPForms alla scheda della barra laterale nella pagina “Widget”.

Dopodiché, è sufficiente selezionare il modulo di registrazione dell’utente dal menu a tendina del blocco WPForms.

Una volta terminato, non dimenticate di fare clic sul pulsante “Aggiorna” per memorizzare le impostazioni.

Ora è possibile visitare il sito web per visualizzare il modulo di registrazione degli utenti nella barra laterale del sito.

Aggiungere il modulo di registrazione utente personalizzato nell’editor completo del sito

Se si utilizza un tema WordPress a blocchi, non si avrà la pagina dei widget. Per aggiungere il modulo di registrazione nella barra laterale con il Full Site Editor (FSE), visitate la pagina Aspetto ” Editor dalla barra laterale dell’amministratore.

Una volta lì, fare clic sul pulsante “Aggiungi blocco” (+) in alto a sinistra per aprire il menu dei blocchi.

Da qui, si deve trovare e aggiungere il blocco WPForms nella posizione che si preferisce sul proprio sito web.

Successivamente, selezionare il modulo di registrazione dal menu a discesa del blocco stesso.

Infine, fare clic sul pulsante “Salva” per memorizzare le impostazioni.

Ora visitate il vostro sito web per vedere il modulo di registrazione utente personalizzato in azione.

Bonus: creare una pagina di accesso personalizzata con il modulo di registrazione

Quando aggiungete il modulo di registrazione a una pagina del vostro sito web, WordPress utilizzerà per impostazione predefinita il layout, il modello e lo stile del vostro tema.

Tuttavia, è possibile creare una splendida pagina di registrazione da zero utilizzando un costruttore di landing page per WordPress.

SeedProd è il miglior costruttore di pagine per WordPress. È facile da usare e offre un costruttore drag-and-drop che aiuta a creare tutti i tipi di landing page. Il plugin offre anche modelli precostituiti e molte funzioni di personalizzazione.

Innanzitutto, è necessario installare e attivare il plugin SeedProd sul proprio sito. Per istruzioni dettagliate, potete consultare il nostro tutorial su come installare un plugin di WordPress.

Dopo l’attivazione, visitare la pagina SeedProd ” Impostazioni per inserire la chiave di licenza del plugin. Queste informazioni si trovano nel proprio account sul sito web di SeedProd.

Dopo aver verificato la chiave, si è pronti a creare una pagina di accesso con il modulo di registrazione.

Per iniziare, andate nella schermata SeedProd ” Pagine di destinazione dalla barra laterale dell’amministrazione e fate clic sul pulsante “Imposta una pagina di accesso”.

Si accede così alla schermata “Scegliere un nuovo modello di pagina”, dove è possibile selezionare un modello predefinito per la pagina di accesso che si sta per creare.

Dopo aver selezionato un modello, viene visualizzata una finestra a comparsa.

A questo punto è necessario inserire un nome per la pagina di destinazione e un URL. Una volta terminato, fare clic sul pulsante “Salva e inizia a modificare la pagina”.

Successivamente, è possibile modificare la pagina di accesso utilizzando il costruttore di pagine di destinazione drag-and-drop di SeedProd.

Per farlo, selezionare un blocco dal menu a sinistra e trascinarlo nel punto in cui si desidera aggiungerlo alla pagina di accesso.

Ad esempio, è possibile aggiungere alla pagina di destinazione un titolo, un’immagine, un video o un blocco di condivisione sociale.

Una volta fatto questo, andate nella sezione Blocchi avanzati della colonna di sinistra.

Da qui, selezionare il blocco “Modulo di contatto” e inserirlo nella pagina di accesso.

Suggeriamo di eliminare il blocco Nome utente e Password esistente dal modello, in modo che gli utenti non debbano inserire due volte le credenziali di accesso.

Quindi, fare clic sul blocco WPForms nella pagina di login per visualizzare le impostazioni nella colonna di sinistra.

A questo punto, nel menu apparirà l’opzione “Seleziona un modulo”.

Da qui, selezionare il modulo di registrazione dal menu a discesa.

Ora si dovrebbe vedere un’anteprima del modulo di registrazione nel costruttore di pagine di destinazione.

Infine, non dimenticate di fare clic sul pulsante “Salva” per memorizzare le modifiche.

Dopodiché, si può andare alla scheda “Connetti” e integrare diversi servizi di email marketing con il modulo di registrazione.

SeedProd si integra facilmente con i servizi di email marketing più diffusi, come Drip, Constant Contact, AWeber e altri, che possono contribuire a migliorare la vostra lista di email.

Successivamente, è possibile accedere alla scheda “Impostazioni della pagina” e modificare lo stato della pagina in Pubblica nelle impostazioni generali.

Da questa scheda è possibile modificare il titolo e l’URL della pagina e attivare il link SeedProd.

Se volete ottimizzare la vostra pagina per i motori di ricerca, andate alla scheda SEO.

Da qui è possibile configurare le impostazioni inserendo un titolo SEO, una descrizione, una miniatura per i social media e altro ancora.

SeedProd consente anche di aggiungere snippet di codice nelle impostazioni degli script. Una volta soddisfatti delle impostazioni, è sufficiente fare clic sul pulsante “Salva” in alto e chiudere il costruttore di pagine.

Dopodiché, andate nella schermata SeedProd ” Pagine di destinazione e attivate l’interruttore sotto la pagina di accesso per rendere la vostra pagina “attiva”.

Ora è possibile visitare la pagina di login per vedere il modulo di registrazione in azione.

Speriamo che questo articolo vi abbia aiutato a imparare come aggiungere facilmente un modulo personalizzato per la registrazione degli utenti in WordPress. Potreste anche voler consultare la nostra guida definitiva all’uso dei moduli di WordPress o la nostra selezione in alto dei migliori plugin per la registrazione degli utenti di WordPress.

Se questo articolo vi è piaciuto, iscrivetevi al nostro canale YouTube per le esercitazioni video su WordPress. Potete trovarci anche su Twitter e Facebook.