Cum să personalizați formularul de înregistrare WooCommerce

Publicat: 2021-07-20

Doriți să vă editați formularele de înregistrare și să obțineți mai multe clienți potențiali? În acest ghid, vă vom arăta diferite moduri de a personaliza formularul de înregistrare WooCommerce cu și fără pluginuri.

Înregistrările online sunt una dintre cele mai esențiale părți ale magazinului dvs. online. Este o procedură standard pentru a permite clienților tăi să creeze un cont nou pentru a cumpăra din magazinul tău. Pentru a evita abandonurile, ar trebui să vă asigurați că formularele de înregistrare sunt adaptate magazinului dvs. și au doar câmpurile necesare.

De ce să personalizați formularul implicit de înregistrare WooCommerce?

Când un client înregistrează un cont nou în magazinul dvs. online, primiți câteva informații despre el, cum ar fi e-mail, nume, adresa de facturare și multe altele. Cu toate acestea, formularul implicit de înregistrare WooCommerce solicită doar adresa de e-mail pentru a înregistra un cont nou. Acest lucru poate accelera procesul pentru client, dar este și o oportunitate pierdută de a vă cunoaște mai bine cumpărătorii.

Dacă clienții trebuie să furnizeze informații suplimentare, trebuie să le adauge în timpul plății sau din pagina „Contul meu”. Aceasta poate fi o procedură foarte repetitivă și lungă pentru cumpărătorii dvs. și ar putea chiar să-i facă să-și piardă interesul față de magazinul dvs. online.

Vestea bună este că puteți evita acest lucru adăugând toate câmpurile necesare în formularul de înregistrare cu informațiile pe care doriți să le obțineți. În acest fel, veți obține informațiile direct, iar clienții nu vor fi nevoiți să-și actualizeze detaliile ulterior, ceea ce va face mai convenabil atât pentru dvs., cât și pentru utilizatorii dvs.

Acum să vedem diferitele metode de editare a formularului de înregistrare WooCommerce .

Cum să personalizați formularul de înregistrare WooCommerce

Există 3 moduri principale de a vă personaliza formularul de înregistrare WooCommerce:

  1. Din tabloul de bord WooCommerce
  2. Cu pluginuri
  3. Din punct de vedere programatic

Să aruncăm o privire la fiecare metodă. Înainte de a începe, asigurați-vă că ați configurat corect WooCommerce în magazinul dvs.

1. Personalizați formularul de înregistrare WooCommerce din tabloul de bord WooCommerce

În mod implicit, vă puteți edita formularul de înregistrare din tabloul de bord WooCommerce. Accesați WooCommerce > Setări și deschideți fila Conturi și confidențialitate . Aici, puteți modifica câteva opțiuni atunci când clienții creează un cont nou în magazinul dvs.

De exemplu, puteți activa opțiuni pentru a genera automat nume de utilizator și parole în timpul creării contului. Aceste opțiuni sunt activate implicit, dar le puteți dezactiva.

tabloul de bord woocommerce personalizați formularul de înregistrare woocommerce

Există, de asemenea, alte opțiuni pentru a le permite clienților să creeze un cont în casă sau pe pagina Contul meu, pentru a le permite cumpărătorilor să plaseze comenzi fără cont și așa mai departe. Pur și simplu verificați opțiunile pe care doriți să le activați și apoi salvați modificările .

După cum puteți vedea, aceste opțiuni implicite sunt destul de limitate pentru a vă edita formularele de înregistrare WooCommerce. Dacă doriți să adăugați mai multe câmpuri sau să faceți modificări mai mari, va trebui să utilizați alte metode.

2. Personalizați formularul de înregistrare WooCommerce folosind pluginuri

Una dintre cele mai bune modalități de a vă personaliza cu ușurință formularul de înregistrare WooCommerce este utilizarea pluginurilor dedicate. Există mai multe instrumente acolo. Pentru acest tutorial, vom demonstra cum să editați formularele de înregistrare utilizând pluginul Înregistrare utilizator .

Înregistrarea utilizatorului este un plugin freemium care vă permite să vă creați propriile formulare personalizate de înregistrare și este 100% receptiv. Va trebui să obțineți suplimentul WooCommerce, care este disponibil în planul lor premium.

2.1. Instalați și activați pluginul și suplimentul WooCommerce

Pentru a începe să utilizați pluginul, trebuie să îl instalați și să îl activați, așa că trebuie să vă abonați la oricare dintre planurile lor premium care sunt integrate cu WooCommerce.

După aceea, în tabloul de bord WooCommerce, accesați Plugin-uri > Adăugați nou și faceți clic pe Încărcați plugin.

Apăsați pe Alegeți fișierul , selectați fișierul zip al pluginului pe care l-ați descărcat după cumpărare și faceți clic pe Instalați acum pentru a instala pluginul.

După instalare, activați pluginul. Accesați Pluginuri > Pluginuri instalate și faceți clic pe Activare lângă extensia WooCommerce Înregistrare utilizator .

Dacă nu sunteți familiarizat cu procesul de instalare în acest mod, consultați ghidul nostru despre cum să instalați manual pluginurile.

2.2. Creați-vă formularul de înregistrare WooCommerce

Pentru a începe să vă creați formularul personalizat de înregistrare WooCommerce, accesați Înregistrare utilizator > Adăugați nou .

creați formular personalizați formularul de înregistrare woocommerce

Vom numi noul nostru formular de înregistrare „ Înregistrare WooCommerce ”, dar îi puteți da orice nume doriți.

În mod implicit, formularul solicită doar adresa de e-mail și parola utilizatorului, dar puteți adăuga alte câmpuri, cum ar fi adresa de facturare și expediere, țara, codul poștal, numărul de telefon și așa mai departe. Pur și simplu trageți și plasați-le în formularul dvs. și, odată ce sunteți mulțumit de noul formular de înregistrare WooCommerce, faceți clic pe Creare formular pentru a-l salva.

2.3. Înlocuiți pagina de înregistrare WooCommerce implicită

După ce creați formularul de înregistrare, trebuie să înlocuiți formularul de înregistrare implicit de pe pagina de înregistrare. Pentru a face acest lucru, accesați WooCommerce > Setări și deschideți fila Conturi și confidențialitate .

Selectați opțiunea pentru a permite clienților să creeze un cont pe pagina „Contul meu” .

creați cont pe pagina contului meu personalizați formularul de înregistrare woocommerce

Apoi, accesați Înregistrarea utilizatorului > Setări, deschideți fila WooCommerce și selectați formularul de înregistrare pe care tocmai l-ați creat în opțiunea Selectați formularul de înregistrare .

După aceea, vor apărea câteva câmpuri și trebuie să bifați opțiunea de a înlocui pagina implicită de conectare și înregistrare a WooCommerce . Pentru a finaliza procesul, salvați modificările .

înlocuiți formularul de înregistrare woocommerce personalizați formularul de înregistrare woocommerce

Acum este timpul să vedeți noul dvs. formular de înregistrare în front-end. Accesați pagina de înregistrare și previzualizați-o pentru a vedea formularul de înregistrare WooCommerce nou personalizat .

formular de înregistrare woocommerce personalizați formularul de înregistrare woocommerce

3. Personalizați formularul de înregistrare WooCommerce în mod programatic

Dacă nu doriți să utilizați un plugin premium și aveți abilități de programare, această metodă este pentru dvs. Puteți edita formularul de înregistrare WooCommerce în aproape orice mod folosind fragmente de cod.

Înainte de a trece mai departe, vă recomandăm să faceți backup site-ului dvs. WordPress și să creați o temă copil. Veți schimba fișierele teme cu aceste fragmente și, dacă ceva nu merge bine, vă pot distruge site-ul, așa că este întotdeauna mai bine să fiți pregătit.

După ce ați făcut o copie de rezervă a site-ului și ați instalat o temă copil, puteți începe să editați formularele de înregistrare. În această secțiune, vă vom arăta diferite exemple de lucruri pe care le puteți face. Va trebui să plasați fragmentele în fișierul functions.php al temei copilului. Pentru a face asta, în tabloul de bord WordPress, accesați Aspect > Editor de teme și deschideți fișierul functions.php .

Înainte de a începe, asigurați-vă că ați bifat opțiunea de a permite clienților să creeze un cont pe pagina „Contul meu” . Pentru a face acest lucru, urmați instrucțiunile descrise în pasul 2.3 dacă nu ați bifat încă acea opțiune.

Acum să aruncăm o privire la câteva exemple pentru a personaliza în mod programatic formularul de înregistrare WooCommerce.

Afișați numărul contului de facturare în formularul de înregistrare

Dacă doriți să adăugați un număr de cont de facturare ca câmp obligatoriu în formularul de înregistrare WooCommerce, puteți utiliza următorul fragment de cod:

 // Afișează un câmp în Înregistrare / Editare cont 
add_action( 'woocommerce_register_form_start', 'ql_display_account_registration_field'); 
add_action( 'woocommerce_edit_account_form_start', 'ql_display_account_registration_field'); 
funcția ql_display_account_registration_field() { 
$user = wp_get_current_user(); 
$value = isset($_POST['billing_account_number']) ? esc_attr($_POST['billing_account_number']) : $user->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( 'Expediere către/Număr de cont', '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 
}

// înregistrare Validare câmp 
add_filter( 'woocommerce_registration_errors', 'ql_account_registration_field_validation', 10, 3 ); 
funcția ql_account_registration_field_validation( $erori, $nume utilizator, $email ) { 
if ( isset( $_POST['billing_account_number'] ) && empty( $_POST['billing_account_number'] ) ) { 
$errors->add( 'billing_account_number_error', __( '<strong>Eroare</strong>: numărul de cont este necesar!', 'woocommerce' ) ); } 
returnează $erori; 
}

// Salvați valoarea câmpului de înregistrare 
add_action( 'woocommerce_created_customer', 'ql_save_account_registration_field'); 
funcția ql_save_account_registration_field( $customer_id ) { 
if ( isset( $_POST['billing_account_number'] ) ) { 
update_user_meta( $customer_id, 'billing_account_number', sanitize_text_field( $_POST['billing_account_number'] ) ); 
}
}

// Salvați valoarea câmpului în contul Editați 
add_action( 'woocommerce_save_account_details', 'ql_save_my_account_billing_account_number', 10, 1 );
funcția 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'] ) ); 
}
}

// Afișează câmpul în secțiunea câmpuri de facturare a utilizatorului de administrator 
add_filter( 'woocommerce_customer_meta_fields', 'ql_admin_user_custom_billing_field', 10, 1 ); 
funcția ql_admin_user_custom_billing_field( 
$args ) { $args['billing']['fields']['billing_account_number'] = array( 
'label' => __( 'Expediere către/Număr de cont', 'woocommerce' ), 
'description' => ''', 
'custom_attributes' => array('maxlength' => 6), 
); 
returnează $args;
}

Aceasta va afișa numărul contului de facturare în secțiunea de editare a contului din pagina Contul meu , precum și pagina de editare a utilizatorului administrator din secțiunea câmpuri de facturare.

Puteți lua acest fragment ca bază și îl puteți ajusta pentru magazinul dvs. De asemenea, puteți adăuga alte câmpuri de formular de înregistrare WooCommerce la secțiunea de facturare, cum ar fi:

  • nume_de_facturare
  • nume_de_facturare
  • companie_facturare
  • adresa_facturare_1
  • adresa_facturare_2
  • oras_facturare
  • codul_poștal_facturare
  • țara facturării
  • stat_facturare
  • e-mail_facturare
  • telefon_facturare

Afișați formularul personalizat de înregistrare WooCommerce în timpul plății

De asemenea, puteți adăuga formularul de înregistrare WooCommerce la pagina de finalizare a comenzii. Acest lucru poate fi foarte convenabil pentru clienții dvs., deoarece le permite să răsfoiască cu ușurință magazinul dvs. ca oaspeți și să creeze un cont numai dacă doresc să cumpere ceva.

Puteți face acest lucru cu ușurință utilizând pluginul Înregistrare utilizator . Veți avea nevoie de unul dintre planurile premium, așa că aruncați o privire la pasul 2.1 dacă nu ați făcut-o deja. În plus, trebuie să creați formularul de înregistrare WooCommerce și să îl înlocuiți cu formularul implicit .

După aceea, accesați WooCommerce > Setări și deschideți fila Conturi și confidențialitate . Apoi, bifați opțiunea pentru a permite clienților să creeze un cont în timpul plății și să salveze modificările .

După aceea, accesați Înregistrarea utilizatorului > Setări și deschideți fila WooCommerce . Bifați opțiunea pentru a sincroniza înregistrările de plată și pentru a salva modificările.

Acest lucru va permite clienților dvs. să sincronizeze înregistrarea utilizatorului cu înregistrarea de plată WooCommerce . După aceea, verificați toate etichetele câmpurilor din tabel și salvați modificările .

formular de înregistrare în checkout personalizați formularul de înregistrare woocommerce

Asta e! Acum clienții tăi vor putea să înregistreze un cont nou în timpul plății pe site-ul tău.

Bonus: Editați adresa de e-mail de înregistrare WooCommerce

Adresele de e-mail sunt fundamentale pentru înregistrare. În calitate de magazin de comerț electronic, doriți să aveți adresele de e-mail ale clienților dvs. pentru a-i putea contacta pe viitor cu informații despre comenzile lor, să le trimiteți oferte, oferte exclusive și așa mai departe.

De aceea, este foarte util să înveți cum să editezi e-mailul de înregistrare WooCommerce . Cel mai bun mod de a face acest lucru este personalizarea șablonului de e-mail. Și cea mai bună parte este că puteți face acest lucru din tabloul de bord WooCommerce.

Pur și simplu accesați WooCommerce > Setări și deschideți fila E- mailuri . Aici, puteți schimba șabloanele de e-mail cu ajutorul opțiunilor pentru expeditorul de e-mail și șabloanele de e-mail.

editați șablonul de e-mail personalizați formularul de înregistrare woocommerce

Opțiunea expeditorului de e -mail vă permite să editați numele și adresa „De la”. Aceasta înseamnă că puteți personaliza modul în care numele expeditorului și adresa de e-mail vor apărea în e-mailul WooCommerce.

În mod similar, puteți edita imaginea antetului șabloanelor de e-mail, textul subsolului, culoarea de bază, culoarea fundalului, fundalul corpului și culoarea textului.

Efectuați toate modificările dorite pentru e-mailul dvs. WooCommerce și vedeți modificările în timp real făcând clic pe linkul „ Faceți clic aici pentru a previzualiza șablonul de e-mail ”.

După ce sunteți mulțumit de noul șablon, nu uitați să salvați modificările .

Există și alte modalități de a edita șabloanele de e-mail care vă permit să personalizați multe alte lucruri. Pentru mai multe informații, consultați ghidul nostru despre cum să editați șabloanele de e-mail WooCommerce.

Concluzie

Una peste alta, formularul de înregistrare este foarte important, deoarece vă permite să colectați informații relevante despre clienții dvs. Formularul de înregistrare implicit nu vă oferă întotdeauna toate informațiile dorite, așa că personalizarea acestuia poate fi o metodă foarte eficientă de a aduna toate detaliile de care aveți nevoie.

În acest ghid, am explorat 3 metode diferite de a personaliza formularul de înregistrare WooCommerce :

  • Din tabloul de bord WC
  • Folosind un plugin dedicat
  • Din punct de vedere programatic

Dacă doriți să faceți câteva modificări ici și acolo, opțiunile implicite din tabloul de bord WooCommerce pot fi utile. Cu toate acestea, opțiunile pe care le oferă sunt destul de limitate, așa că dacă doriți să personalizați mai multe lucruri, vă recomandăm să utilizați un plugin. Pe de altă parte, dacă nu doriți să instalați un instrument terță parte și aveți abilități de codare, puteți edita formularul de înregistrare în mod programatic folosind fragmente de cod.

Pentru mai multe informații despre cum să vă personalizați magazinul, aruncați o privire la următoarele ghiduri:

  • Cum să personalizați pagina WooCommerce Contul meu
  • Editați pagina produsului WooCommerce
  • Cum să personalizați pagina categoriei în WooCommerce
  • Cum se editează pagina de magazin WooCommerce