Cum să personalizați formularele de autentificare și înregistrare WooCommerce

Din cutie, WooCommerce oferă opțiuni limitate de personalizare pentru formularele de autentificare și înregistrare. Acest lucru face dificil pentru proprietarii de magazine să ofere clienților o experiență bună de utilizare.

În plus, sunteți limitat la câmpurile implicite de plată, ceea ce înseamnă că nu puteți aduna informații suplimentare de la client în timpul plății. Acest lucru nu este ideal pentru magazinele care doresc să ofere clienților opțiunea de a selecta datele de rezervare, de a introduce mai multe adrese de e-mail sau de a oferi opțiuni de împachetare pentru cadouri.

O modalitate de a depăși acest lucru este utilizarea unui plugin robust, cum ar fi ProfilePress, care vă permite să gestionați totul într-un singur loc. În acest articol, vom analiza modul în care puteți personaliza formularele de autentificare și înregistrare WooCommerce folosind ProfilePress.

De ce să personalizați formularele de autentificare și înregistrare WooCommerce?

Personalizarea formularelor de autentificare și înregistrare WooCommerce vă poate ajuta să vă faceți site-ul mai ușor de utilizat și să creșteți conversiile.

Proprietarii de magazine ar putea avea nevoie să personalizeze formularele implicite de conectare și înregistrare WooCommerce pentru a oferi clienților o experiență personalizată. Prin crearea unui formular exclusiv de autentificare și înregistrare, puteți îmbunătăți experiența clientului pe site-ul dvs. și puteți maximiza înregistrările.

De asemenea, puteți adăuga câmpuri personalizate la pagina de finalizare a comenzii site-ului dvs. WooCommerce ca o modalitate de a aduna informații suplimentare de la client înainte de a finaliza achiziția. De exemplu, puteți permite clienților să își adauge conturile de rețele sociale, numele de utilizator sau să afișeze informații suplimentare despre produse în coșul de cumpărături. Acest lucru vă ajută să oferiți clienților dvs. o experiență de cumpărături mai personalizată.

Înlocuirea paginii implicite „Contul meu” din WooCommerce cu una personalizată este o modalitate excelentă de a vă scoate în evidență magazinul. Puteți permite clienților să se conecteze cu ușurință la conturile lor și să își gestioneze detaliile dintr-un loc centralizat. De exemplu, se pot autentifica, se pot înscrie și personaliza conturile de utilizator prin încărcarea fotografiilor de profil, editarea poreclelor sau adăugând o biografie.

Personalizarea formularelor de autentificare și înregistrare WooCommerce vă poate ajuta să oferiți o experiență de utilizator îmbunătățită în magazinul dvs. online.

Personalizarea formularelor de autentificare și înregistrare WooCommerce

Folosind ProfilePress, este ușor să personalizați formularele de autentificare și înregistrare WooCommerce și să le faceți să arate exact așa cum doriți.

ProfilePress oferă o soluție all-in-one pentru crearea de site-uri WordPress captivante și oferă instrumente extinse care vă ajută să controlați cine are acces la conținutul dvs. Puteți crea profiluri intuitive de utilizator împreună cu formulare atractive de înregistrare și autentificare folosind un generator de drag-and-drop.

Pentru aceasta, vom avea nevoie de un site WordPress funcțional cu pluginul WooCommerce instalat. De asemenea, vom avea nevoie de pluginul ProfilePress pentru a crea formulare personalizate de autentificare și înregistrare.

Pasul #1: Instalați și activați ProfilePress

Începeți prin obținerea pluginului ProfilePress și instalarea acestuia pe site-ul dvs. WordPress. Navigați la Pluginuri → Adăugați nou folosind panoul de administrare WordPress și faceți clic pe butonul Adăugare nou . Încărcați fișierul zip și instalați pluginul pe site-ul dvs. WordPress.

Pasul #2: Personalizați formularele de autentificare și înregistrare

Primul lucru pe care trebuie să-l facem este să începem să creăm formularul nostru personalizat de conectare folosind ProfilePress. Pentru a face acest lucru, navigați la ProfilePress → Forms & Profiles și faceți clic pe butonul Adăugare nou din secțiunea Conectare . Faceți clic pe Drag & Drop Builder și selectați un șablon. În scopul acestei demonstrații, am selectat șablonul Bash .

Odată ce selectați șablonul, veți fi redirecționat automat către pagina Editați formular . Puteți adăuga și plasa câmpuri în ordinea pe care o preferați și, de asemenea, puteți edita etichetele câmpurilor .

De asemenea, puteți edita setările formularului și puteți personaliza aspectul și etichetele butoanelor din formularul de conectare. După ce ați terminat, faceți clic pe butonul Salvare modificări pentru a continua. Acum trebuie să creăm o nouă pagină WordPress și să adăugăm formularul personalizat de autentificare la pagina respectivă folosind codul scurt personalizat.

Navigați la Pagini → Adăugați nou pentru a crea o pagină nouă și adăugați codul scurt al formularului de conectare la pagină. Faceți clic pe butonul Publicare pentru a continua.

Acum, vom crea formularul de înregistrare și îl vom adăuga la o nouă pagină WordPress. Pentru a face acest lucru, navigați la ProfilePress → Forms & Profiles și faceți clic pe butonul Adăugare nou din secțiunea Înregistrare .

Dați formularului de înregistrare un titlu și selectați un șablon pentru a începe să-l personalizați. Am selectat șablonul Lalea . Veți fi redirecționat automat către pagina Editare formular .

Aici, puteți adăuga sau elimina câmpuri din formularul dvs. de înregistrare și puteți schimba modul în care acestea arată pe front-end. După ce ați terminat de personalizat formularul de înregistrare, faceți clic pe butonul Salvare modificări pentru a continua.

Pentru a crea o nouă pagină de înregistrare WordPress, accesați Pagini → Adăugați nou și inserați codul scurt al formularului de înregistrare. Faceți clic pe butonul Publicare pentru a continua.

Pasul #3: Afișați formularele de autentificare și înregistrare pe front-end

Mergeți la ProfilePress → Setări și faceți clic pe fila General . Adăugați paginile personalizate de autentificare și înregistrare nou create în magazin folosind meniurile drop-down și faceți clic pe butonul Salvare modificări pentru a continua.

Aceasta va înlocui pagina implicită de autentificare WordPress și toate linkurile de conectare și înregistrare de la WooCommerce cu cele ProfilePress . Iată cum arată pe partea din față a site-ului dvs.

Pasul #3.5: Înlocuirea formularelor de autentificare și înregistrare WooCommerce

Pentru a înlocui formularele de înregistrare și autentificare afișate pe pagina Contul meu WooCommerce, accesați Setări >> WooCommerce și selectați formularele de autentificare și înregistrare ProfilePress cu care să le înlocuiți.

Utilizatorii se vor putea înregistra pentru un cont pe site-ul tău WooCommerce utilizând formularul de înregistrare personalizat atractiv. Utilizatorii deja înregistrați se pot conecta la contul lor folosind formularul personalizat de conectare pe care l-am creat mai devreme:

Pasul 4: Adăugați câmpuri personalizate la pagina de finalizare a achiziției

De asemenea, puteți adăuga câmpuri personalizate la pagina de finalizare a comenzii magazinului dvs. WooCommerce. Pentru a face acest lucru, pur și simplu navigați la ProfilePress → Setări și faceți clic pe fila Câmpuri personalizate .

Faceți clic pe butonul Adăugare nou și setați o etichetă de câmp pentru câmpul dvs. personalizat. După ce setați Cheia câmpului și Descrierea câmpului, puteți seta Tipul câmpului în funcție de ceea ce aveți nevoie.

Puteți crea text, parole, e-mail, telefon, câmpuri ascunse, număr, dată, țară, încărcare fișier, butoane radio, casete de selectare, câmpuri pentru zona de text și le puteți afișa pe pagina de finalizare a magazinului dvs. WooCommerce.

După ce sunteți gata, faceți clic pe butonul Salvați modificările pentru a continua.

Apoi, accesați ProfilePress → Setări și faceți clic pe fila WooCommerce . Adăugați câmpurile personalizate în metacaseta Câmpuri de înregistrare obligatorii și faceți clic pe butonul Salvare modificări pentru a continua.

Utilizatorii vor putea vedea câmpurile personalizate de pe pagina de înregistrare a comenzii atunci când fac checkout din magazinul dvs. online

.

În plus, dorim să afișăm formularul de conectare personalizat pe pagina de finalizare a comenzii și să îl înlocuim pe cel implicit. Pentru a face acest lucru, pur și simplu navigați la ProfilePress → Setări și faceți clic pe fila WooCommerce .

Selectați formularul de autentificare personalizat utilizând meniul derulant de lângă Formular de autentificare Checkout și faceți clic pe butonul Salvare modificări pentru a continua. Aceasta va înlocui formularul de conectare implicit de pe pagina de finalizare a comenzii site-ului dumneavoastră WooCommerce.

Bonus: creați o pagină personalizată „Contul meu” WooCommerce

Pagina „Contul meu” din WooCommerce le permite vizitatorilor site-ului să-și acceseze contul de utilizator direct din front-end.

ProfilePress vă permite să creați o pagină WooCommerce „Contul meu” complet personalizată, unde utilizatorii își pot vizualiza cu ușurință conturile de utilizator și le pot edita, totul dintr-o singură pagină. Pentru a face acest lucru, navigați la Apăsați profil → Forme și profiluri și faceți clic pe butonul Adăugare nou .

Dați-vă formularului Editare profil un nume nou și selectați un șablon pentru a începe personalizarea. Am selectat șablonul Pinnacle . Odată ce faceți clic pe butonul Selectați șablonul , acesta vă va redirecționa automat către pagina Editare formular .

Puteți adăuga câmpuri și personaliza modul în care arată formularul dvs. pe front-end-ul site-ului dvs. WooCommerce. După ce ați terminat de personalizat formularul „Contul meu”, faceți clic pe butonul Salvați modificările pentru a continua.

Acum că am creat formularul „Contul meu”, trebuie să creăm o pagină WordPress pentru a o putea afișa pe site-ul dvs. web. Accesați Pagini → Adăugați nou și inserați codul scurt Editare profil . Faceți clic pe butonul Publicați după ce ați terminat.

Și mai jos este o previzualizare a formularului personalizat de editare a profilului.

Sau puteți sări peste întregul proces și, în schimb, să utilizați codul scurt ProfilePress My Account din pagina creată mai sus.

Utilizatorii vor putea să-și editeze informațiile contului și să facă clic pe butonul Actualizare profil pentru a face modificări în conturile lor de utilizator direct din front-end. Pagina va servi ca noua pagină Contul meu.

De asemenea, puteți permite utilizatorilor să își vadă comenzile, descărcările, abonamentele și calitatea de membru, accesând ProfilePress → Setări. Faceți clic pe fila WooCommerce și selectați filele de afișat în setarea Filele Contul meu.

Concluzie

Personalizarea formularelor de autentificare și înregistrare WooCommerce de pe site-ul dvs. este o modalitate excelentă de a îmbunătăți experiența clienților și de a încuraja mai mulți utilizatori să se înregistreze cu dvs.

Deși WordPress oferă în mod implicit o funcționalitate limitată de personalizare pentru paginile de conectare și înregistrare, puteți utiliza un plugin robust, cum ar fi ProfilePress, pentru a crea pagini personalizate și pentru a îmbunătăți experiența utilizatorului oferită de magazinul dvs. online.

Sunteți gata să personalizați formularele de autentificare și înregistrare WooCommerce pe site-ul dvs.? Obțineți ProfilePress astăzi!