Come personalizzare il modulo di registrazione WooCommerce
Pubblicato: 2021-07-20Vuoi modificare i moduli di registrazione e ottenere più contatti? In questa guida ti mostreremo diversi modi per personalizzare il modulo di registrazione di WooCommerce con e senza plug-in.
Le registrazioni online sono una delle parti più essenziali del tuo negozio online. È una procedura standard per consentire ai tuoi clienti di creare un nuovo account per acquistare dal tuo negozio. Per evitare abbandoni, assicurati che i moduli di registrazione siano personalizzati per il tuo negozio e contengano solo i campi necessari.
Perché personalizzare il modulo di registrazione WooCommerce predefinito?
Quando un cliente registra un nuovo account nel tuo negozio online, ricevi alcune informazioni su di lui come e-mail, nome, indirizzo di fatturazione e altro. Tuttavia, il modulo di registrazione WooCommerce predefinito richiede solo l'indirizzo e-mail per registrare un nuovo account. Questo può rendere il processo più veloce per il cliente, ma è anche un'opportunità sprecata per conoscere meglio i tuoi acquirenti.
Se i clienti devono fornire informazioni aggiuntive, devono aggiungerle durante il checkout o dalla pagina "Il mio account". Questa può essere una procedura molto ripetitiva e lunga per i tuoi acquirenti e potrebbe persino far perdere loro interesse per il tuo negozio online.
La buona notizia è che puoi evitarlo aggiungendo tutti i campi necessari al modulo di registrazione con le informazioni che desideri ottenere. In questo modo, otterrai le informazioni direttamente e i clienti non dovranno aggiornare i loro dettagli in un secondo momento, rendendoli più convenienti sia per te che per i tuoi utenti.
Vediamo ora i diversi metodi per modificare il modulo di registrazione di WooCommerce .
Come personalizzare il modulo di registrazione WooCommerce
Ci sono 3 modi principali per personalizzare il tuo modulo di registrazione WooCommerce:
- Dalla dashboard di WooCommerce
- Con plugin
- Programmaticamente
Diamo un'occhiata a ciascun metodo. Prima di iniziare, assicurati di aver impostato correttamente WooCommerce nel tuo negozio.
1. Personalizza il modulo di registrazione di WooCommerce dalla dashboard di WooCommerce
Per impostazione predefinita, puoi modificare il tuo modulo di registrazione dalla dashboard di WooCommerce. Vai su WooCommerce > Impostazioni e apri la scheda Account e Privacy . Qui puoi modificare alcune opzioni quando i clienti creano un nuovo account nel tuo negozio.
Ad esempio, puoi attivare le opzioni per generare automaticamente nomi utente e password durante la creazione dell'account. Queste opzioni sono attivate per impostazione predefinita, ma puoi disabilitarle.
Ci sono anche altre opzioni per consentire ai clienti di creare un account alla cassa o nella pagina Il mio account, consentire agli acquirenti di effettuare ordini senza un account e così via. Basta controllare le opzioni che si desidera abilitare e quindi salvare le modifiche .
Come puoi vedere, queste opzioni predefinite sono piuttosto limitate per modificare i moduli di registrazione di WooCommerce. Se desideri aggiungere più campi o apportare modifiche maggiori, dovrai utilizzare altri metodi.
2. Personalizza il modulo di registrazione WooCommerce utilizzando i plugin
Uno dei modi migliori per personalizzare facilmente il tuo modulo di registrazione WooCommerce è utilizzare plugin dedicati. Ci sono diversi strumenti là fuori. Per questo tutorial, dimostreremo come modificare i moduli di registrazione utilizzando il plug-in Registrazione utente .
Registrazione utente è un plug-in freemium che ti consente di creare i tuoi moduli di registrazione personalizzati ed è reattivo al 100%. Dovrai ottenere il componente aggiuntivo WooCommerce disponibile nel loro piano premium.
2.1. Installa e attiva il plug-in e il componente aggiuntivo WooCommerce
Per iniziare a utilizzare il plug-in, devi installarlo e attivarlo, quindi devi abbonarti a uno qualsiasi dei loro piani premium integrati con WooCommerce.
Successivamente, nella dashboard di WooCommerce, vai su Plugin> Aggiungi nuovo e fai clic su Carica plug-in.
Premi Scegli file , seleziona il file zip del plug-in che hai scaricato dopo l'acquisto e fai clic su Installa ora per installare il plug-in.
Dopo l'installazione, attiva il plugin. Vai su Plugin > Plugin installati e fai clic su Attiva accanto all'estensione Registrazione utente WooCommerce .
Se non hai familiarità con il processo di installazione in questo modo, consulta la nostra guida su come installare i plug-in manualmente.
2.2. Crea il tuo modulo di registrazione WooCommerce
Per iniziare a creare il tuo modulo di registrazione WooCommerce personalizzato, vai su Registrazione utente > Aggiungi nuovo .
Chiameremo il nostro nuovo modulo di registrazione " Registrazione WooCommerce ", ma puoi assegnargli il nome che desideri.
Per impostazione predefinita, il modulo richiede solo l'e-mail e la password dell'utente, ma puoi aggiungere altri campi come indirizzo di fatturazione e spedizione, paese, codice postale, numero di telefono e così via. Basta trascinarli e rilasciarli sul tuo modulo e una volta che sei soddisfatto del tuo nuovo modulo di registrazione a WooCommerce, fai clic su Crea modulo per salvarlo.
2.3. Sostituisci la pagina di registrazione WooCommerce predefinita
Dopo aver creato il modulo di registrazione, è necessario sostituire il modulo di registrazione predefinito nella pagina di registrazione. Per fare ciò, vai su WooCommerce > Impostazioni e apri la scheda Account e Privacy .
Seleziona l'opzione per consentire ai clienti di creare un account nella pagina "Il mio account" .
Quindi, vai su Registrazione utente> Impostazioni, apri la scheda WooCommerce e seleziona il modulo di registrazione che hai appena creato nell'opzione Seleziona modulo di registrazione .
Dopodiché, appariranno alcuni campi e dovrai spuntare l'opzione per sostituire la pagina di accesso e registrazione di WooCommerce predefinita . Per completare il processo, salva le modifiche .
Ora è il momento di vedere il tuo nuovo modulo di registrazione nel front-end. Vai alla pagina di registrazione e visualizza l'anteprima per vedere il modulo di registrazione WooCommerce appena personalizzato .
3. Personalizza il modulo di registrazione WooCommerce in modo programmatico
Se non vuoi utilizzare un plug-in premium e hai capacità di programmazione, questo metodo fa per te. Puoi modificare il modulo di registrazione di WooCommerce in quasi tutti i modi utilizzando frammenti di codice.
Prima di andare oltre, ti consigliamo di eseguire il backup del tuo sito Web WordPress e di creare un tema figlio. Cambierai i file del tema con questi frammenti e se qualcosa va storto possono danneggiare il tuo sito, quindi è sempre meglio essere preparati.
Dopo aver eseguito il backup del sito e installato un tema figlio, puoi iniziare a modificare i moduli di registrazione. In questa sezione, ti mostreremo diversi esempi di cose che puoi fare. Dovrai inserire gli snippet nel file functions.php del tuo tema figlio. Per farlo, nella dashboard di WordPress, vai su Aspetto > Editor di temi e apri il file functions.php .
Prima di iniziare, assicurati di aver selezionato l'opzione per consentire ai clienti di creare un account nella pagina "Il mio account" . Per fare ciò, segui le istruzioni descritte nel passaggio 2.3 se non hai ancora selezionato quell'opzione.
Ora diamo un'occhiata ad alcuni esempi per personalizzare il modulo di registrazione di WooCommerce in modo programmatico.
Visualizza il numero di conto di fatturazione nel modulo di registrazione
Se desideri aggiungere un numero di account di fatturazione come campo obbligatorio al tuo modulo di registrazione a WooCommerce, puoi utilizzare il seguente snippet di codice:
// Visualizza un campo in Registrazione/Modifica account add_action('woocommerce_register_form_start', 'ql_display_account_registration_field'); add_action( 'woocommerce_edit_account_form_start', 'ql_display_account_registration_field' ); funzione ql_display_account_registration_field() { $utente = wp_get_utente_corrente(); $value = isset($_POST['billing_account_number']) ? esc_attr($_POST['billing_account_number']) : $utente->billing_account_number; ?> <p class="woocommerce-form-row woocommerce-form-row--wide form-row form-row-wide"> <label for="reg_billing_account_number"><?php _e( 'Spedisci a/Numero di conto', 'woocommerce' ); ?> <span class="required">*</span></label> <input type="text" maxlength="6" class="input-text" name="billing_account_number" value="<?php echo $value ?>" /> </p> <div class="clear"></div> <?php } // registrazione Convalida del campo add_filter('woocommerce_registration_errors', 'ql_account_registration_field_validation', 10, 3); funzione ql_account_registration_field_validation($errori, $nome utente, $email) { if ( isset( $_POST['billing_account_number'] ) && vuoto( $_POST['billing_account_number'] ) ) { $errors->add( 'billing_account_number_error', __( '<strong>Errore</strong>: il numero di account è richiesto!', 'woocommerce' ) ); } restituisce $errori; } // Salva il valore del campo di registrazione add_action('woocommerce_created_customer', 'ql_save_account_registration_field'); funzione ql_save_account_registration_field($id_cliente) { if ( isset( $_POST['billing_account_number'] ) ) { update_user_meta($customer_id, 'billing_account_number', sanitize_text_field($_POST['billing_account_number'])); } } // Salva il valore del campo in Modifica account add_action( 'woocommerce_save_account_details', 'ql_save_my_account_billing_account_number', 10, 1 ); funzione ql_save_my_account_billing_account_number($user_id) { if( isset( $_POST['billing_account_number'] ) ){ update_user_meta($user_id, 'billing_account_number', sanitize_text_field($_POST['billing_account_number'])); } } // Visualizza il campo nella sezione dei campi di fatturazione dell'utente amministratore add_filter( 'woocommerce_customer_meta_fields', 'ql_admin_user_custom_billing_field', 10, 1 ); funzione ql_admin_user_custom_billing_field( $args ) { $args['billing']['fields']['billing_account_number'] = array( 'label' => __( 'Spedisci a/Numero di conto', 'woocommerce' ), 'descrizione' => '', 'custom_attributes' => array('maxlength' => 6), ); restituisce $args; }
Questo mostrerà il numero dell'account di fatturazione nella sezione di modifica dell'account della pagina Il mio account e la pagina di modifica dell'utente amministratore nella sezione dei campi di fatturazione.
Puoi prendere questo frammento come base e adattarlo al tuo negozio. Puoi anche aggiungere altri campi del modulo di registrazione WooCommerce alla sezione di fatturazione come:
- nome_fatturazione
- cognome_fatturazione
- billing_company
- Indirizzo di fatturazione 1
- indirizzo_fatturazione_2
- billing_city
- billing_postcode
- Paese di fatturazione
- billing_state
- fatturazione_e-mail
- billing_phone
Visualizza il modulo di registrazione WooCommerce personalizzato durante il checkout
Puoi anche aggiungere il modulo di registrazione WooCommerce alla pagina di pagamento. Questo può essere molto conveniente per i tuoi clienti in quanto consente loro di navigare facilmente nel tuo negozio come ospiti e creare un account solo se vogliono acquistare qualcosa.
Puoi farlo facilmente utilizzando il plug-in Registrazione utente . Avrai bisogno di uno dei piani premium, quindi dai un'occhiata al passaggio 2.1 se non l'hai già fatto. Inoltre, devi creare il tuo modulo di registrazione WooCommerce e sostituirlo con il modulo predefinito .
Successivamente, vai su WooCommerce> Impostazioni e apri la scheda Account e privacy . Quindi, seleziona l'opzione per consentire ai clienti di creare un account durante il checkout e salvare le modifiche .
Successivamente, vai su Registrazione utente> Impostazioni e apri la scheda WooCommerce . Spunta l'opzione per sincronizzare le registrazioni alla cassa e salvare le modifiche.
Ciò consentirà ai tuoi clienti di sincronizzare la registrazione dell'utente con la registrazione alla cassa di WooCommerce . Dopodiché, controlla tutte le etichette dei campi nella tabella e salva le modifiche .
Questo è tutto! Ora i tuoi clienti potranno registrare un nuovo account durante il checkout sul tuo sito web.
Bonus: modifica l'indirizzo email di registrazione di WooCommerce
Gli indirizzi email sono fondamentali per la registrazione. Come negozio di eCommerce, desideri avere gli indirizzi e-mail dei tuoi clienti per poterli contattare in futuro con informazioni sui loro ordini, inviare loro offerte, offerte esclusive e così via.
Ecco perché imparare a modificare l'e-mail di registrazione di WooCommerce è molto utile. Il modo migliore per farlo è personalizzare il modello di email. E la parte migliore è che puoi farlo dalla dashboard di WooCommerce.
Vai semplicemente su WooCommerce > Impostazioni e apri la scheda Email . Qui puoi modificare i modelli di e-mail con l'aiuto delle opzioni di mittente e-mail e modello di e-mail.
L' opzione del mittente dell'e-mail consente di modificare il nome e l'indirizzo "Da". Ciò significa che puoi personalizzare il modo in cui il nome del mittente e l'indirizzo e-mail verranno visualizzati nell'e-mail di WooCommerce.
Allo stesso modo, puoi modificare l'immagine dell'intestazione, il testo del piè di pagina, il colore di base, il colore di sfondo, lo sfondo del corpo e il colore del testo dei modelli di posta elettronica .
Apporta tutte le modifiche che desideri per la tua email WooCommerce e guarda le modifiche in tempo reale facendo clic sul link " Fai clic qui per visualizzare in anteprima il tuo modello di email ".
Quando sei soddisfatto del tuo nuovo modello, ricorda di salvare le modifiche .
Esistono altri modi per modificare i modelli di posta elettronica che ti consentono di personalizzare molte altre cose. Per ulteriori informazioni, consulta la nostra guida su come modificare i modelli di email di WooCommerce.
Conclusione
Tutto sommato, il modulo di registrazione è molto importante in quanto ti consente di raccogliere informazioni rilevanti sui tuoi clienti. Il modulo di registrazione predefinito non sempre ti fornisce tutte le informazioni che desideri, quindi personalizzarlo può essere un metodo molto efficace per raccogliere tutti i dettagli di cui hai bisogno.
In questa guida, abbiamo esplorato 3 diversi metodi per personalizzare il modulo di registrazione di WooCommerce :
- Dal cruscotto del WC
- Utilizzo di un plug-in dedicato
- Programmaticamente
Se vuoi apportare alcune modifiche qua e là, le opzioni predefinite dalla dashboard di WooCommerce possono essere utili. Tuttavia, le opzioni che offre sono piuttosto limitate, quindi se desideri personalizzare più cose, ti consigliamo di utilizzare un plug-in. D'altra parte, se non vuoi installare uno strumento di terze parti e hai competenze di codifica, puoi modificare il modulo di registrazione a livello di codice utilizzando frammenti di codice.
Per ulteriori informazioni su come personalizzare il tuo negozio, dai un'occhiata alle seguenti guide:
- Come personalizzare la pagina Il mio account di WooCommerce
- Modifica la pagina del prodotto WooCommerce
- Come personalizzare la pagina delle categorie in WooCommerce
- Come modificare la pagina del negozio WooCommerce