Trusted WordPress tutorials, when you need them most.
Beginner’s Guide to WordPress
Coppa WPB
25 Million+
Websites using our plugins
16+
Years of WordPress experience
3000+
WordPress tutorials
by experts

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.

How to Create a User Registration Form

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.

Nota: WPForms ha anche una versione gratuita. Tuttavia, per sbloccare l’add-on per la registrazione degli utenti è necessario passare al piano pro.

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.

Enter WPForms license key

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.

Install user registration and login forms addon

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.

Select the user registration form template

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.

Add more form fields in your user registration form

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.

Edit Field Options

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”.

Click the Add Field group button

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.

Add the field group name

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.

Choose field type and label

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.

Toggle the required switch and add character limit

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.

Configure the presentation settings

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.

Configure location rules

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ì.

Toggle the active switch

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.

Save custom field group

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.

View your custom field

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.

Add a website field to your registration form

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.

Edit the label of website field

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”.

Choose custom field from the website dropdown menu

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.

Enter Custom User Meta details

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.

Add user registration form to the block editor

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.

User registration form preview

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.

Add user registration form as a widget

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.

Preview of user registration form in the sidebar

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.

Add user registration form in full site editor

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.

User registration form preview

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.

Nota: SeedProd ha anche una versione gratuita che si può utilizzare. Tuttavia, per questo tutorial utilizzeremo la versione pro del plugin, che include un modello di pagina di accesso per gli utenti e funzioni di personalizzazione avanzate.

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.

Paste license key

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”.

Setup your login page

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”.

Enter a Name and URL for your login page

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.

Add blocks to your login page template

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.

Add the Contact Form block

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.

Select your registration form in SeedProd

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.

Preview of registration form in landing page builder

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.

Connect email marketing services

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.

Publish your login page from the page settings

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.

Make your login page active

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.

Registration form landing page preview

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.

Divulgazione: I nostri contenuti sono sostenuti dai lettori. Ciò significa che se cliccate su alcuni dei nostri link, potremmo guadagnare una commissione. Vedi come WPBeginner è finanziato , perché è importante e come puoi sostenerci. Ecco il nostro processo editoriale .

Avatar

Editorial Staff at WPBeginner is a team of WordPress experts led by Syed Balkhi with over 16 years of experience in WordPress, Web Hosting, eCommerce, SEO, and Marketing. Started in 2009, WPBeginner is now the largest free WordPress resource site in the industry and is often referred to as the Wikipedia for WordPress.

Il kit di strumenti WordPress definitivo

Ottenete l'accesso gratuito al nostro kit di strumenti - una raccolta di prodotti e risorse relative a WordPress che ogni professionista dovrebbe avere!

Reader Interactions

9 commentiLascia una risposta

  1. Syed Balkhi

    Hey WPBeginner readers,
    Did you know you can win exciting prizes by commenting on WPBeginner?
    Every month, our top blog commenters will win HUGE rewards, including premium WordPress plugin licenses and cash prizes.
    You can get more details about the contest from here.
    Start sharing your thoughts below to stand a chance to win!

  2. Faisal

    How can I modify the confirmation email which is sent to the user after he submits the registration form? I don’t want to display certain info in the email such as the login link.

  3. Vikas Shukla

    How can we disable the default fron New User Approve plugin? or how we can apply woocommerce template to this one?

    Thanks

  4. Waseem Safdar

    Does it also fulfill the purpose of Theme My Login ?
    I mean if I install this I’d be able to cater to the mentioned plugin’s feature as well right?

    • Waseem Safdar

      No need to reply, I got my answer. Thank you. :)
      P.S: You people are doing a great job! Keep it up! :)

      • Mark Cub

        What was your answer? Does it do what Theme My Login does?

  5. Bongo

    I meant, will it allow me to create customs in general?

  6. Bongo

    Great plugin. Will this plugin allow me to add the form elements to my current default WooCommerce forms?

    Is having too many plugins safe for my WordPress site? Will it not slow down or be expose in terms of Security?

Lascia una risposta

Grazie per aver scelto di lasciare un commento. Tenga presente che tutti i commenti sono moderati in base alle nostre politica dei commenti e il suo indirizzo e-mail NON sarà pubblicato. Si prega di NON utilizzare parole chiave nel campo del nome. Avremo una conversazione personale e significativa.