Cum se face un formular cu un câmp repetitor în WPForms

Publicat: 2023-10-04

Vă întrebați cum să încorporați un câmp repetitor WPForms în formularele dvs. online pentru a captura mai multe date pentru fiecare trimitere a formularului?

Câmpurile repetoare din formulare permit utilizatorilor să introducă mai multe seturi de date similare, făcând în același timp formularele mai intuitive și mai ușor de utilizat.

În acest articol, vă vom arăta cel mai simplu mod de a proiecta un câmp repetitor pentru WPForms pentru a îmbunătăți funcționalitatea site-ului dvs. și experiența utilizatorului.

În acest articol

  • 1. Abonați-vă și instalați WPForms Pro
  • 2. Creați un nou formular necompletat
  • 3. Adăugați un câmp derulant cu opțiuni Da/Nu
  • 4. Aplicați logica condiționată câmpurilor dvs. de formular
  • 5. Activați logica condiționată pentru câmpurile derulante
  • 6. Activați Notificări și confirmări de formulare
  • 8. Publicați formularul dvs. cu câmpuri repetitoare
  • Mai multe întrebări despre câmpul Repeater WPForms

De ce să folosiți un câmp WPForms Repeater?

Frumusețea câmpului repetitor WPForms constă în capacitatea sa de a eficientiza colectarea datelor, oferind în același timp câteva alte beneficii, cum ar fi:

  • Proiectare centrată pe utilizator: prin introducerea câmpurilor repetoare, îi permiteți utilizatorilor să dicteze amploarea intrării lor. Este un semn subtil la autonomia utilizatorului și îmbunătățește experiența generală a utilizatorului.
  • Flexibilitate în proiectarea formularelor: fiecare formular nu este unic pentru toate. Cu câmpurile repetoare, puteți răspunde diferitelor scenarii – fie că este o singură intrare sau mai multe intrări, asigurându-vă că formularul dvs. se adaptează la diverse cerințe.
  • Structurarea consecventă a datelor: Una dintre provocările cu mai multe câmpuri este datele inconsecvente. Datele rămân structurate și uniforme cu câmpuri repetoare, simplificând procesarea și analiza backend.
  • Lungime redusă a formularului: În loc să aibă un formular lung, intimidant, cu numeroase câmpuri, câmpurile repetoare oferă un aspect mai curat, asigurându-se că utilizatorii nu sunt copleșiți la prima vedere.

Fie că ești un antreprenor care urmărește o integrare eficientă a clienților sau un blogger pasionat de colectarea eficientă a datelor, câmpul repetitor WPForms este de neprețuit. Să ne scufundăm în pașii pentru a-l configura!

Cum se face un formular cu un câmp repetitor în WPForms

Crearea unui formular cu un câmp repetitor în WPForms este destul de ușoară și necesită doar o înțelegere de bază a logicii condiționate. Urmați pașii de mai jos pentru a începe:

1. Abonați-vă și instalați WPForms Pro

Când vine vorba de crearea de formulare unice, WPForms este cea mai bună opțiune. Îl poți folosi pentru a crea și a publica orice tip de formular în WordPress. Plugin-ul de formular vine cu peste 1.000 de șabloane de formular, care pot fi folosite pentru a crea formulare de câmp repetitoare.

Deoarece vom folosi logica condiționată pentru a configura câmpurile repetitoare din formularul dvs. pentru acest ghid, trebuie să vă abonați la WPForms Pro, care vă oferă, de asemenea, acces la integrări premium, suplimente și o mulțime de funcții utile.

WPForms homepage

După achiziționarea unui abonament la WPForms Pro, trebuie să instalați și să activați pluginul pe site-ul dvs. WordPress.

Acum, haideți să vă creăm formularul!

2. Creați un nou formular necompletat

Accesați WPForms din tabloul de bord WordPress și alegeți Adăugare nou din lista de opțiuni.

Add new form WPForms

Apoi, dați un nume formularului și alegeți un șablon WPForms existent sau doar configurați un formular nou în funcție de nevoile dvs.

În acest tutorial, vom crea un formular nou pentru a vă arăta toți pașii esențiali pentru configurarea câmpului de repetare. Deci, vom alege opțiunea Creare formular necompletat .

Create a blank form for repeater field

Acum veți fi direcționat către ecranul Câmpuri , unde câmpurile disponibile apar pe panoul din stânga. Cele la care aveți acces vor depinde de nivelul de licență.

WPForms fields menu

Veți vedea o previzualizare editabilă a formularului dvs. în panoul din dreapta. Deoarece am selectat un Formular necompletat, această secțiune va apărea goală.

Add fields to your repeater form

Utilizați generatorul intuitiv de formulare WPForms pentru a adăuga, modifica și aranja cu ușurință câmpuri personalizate pentru a adapta formularul după cum doriți.

Pentru acest tutorial, vom adăuga tipuri de câmpuri principale, cum ar fi Nume , E-mail și Telefon , pentru a obține informațiile pentru un singur utilizator, de exemplu, Registrant 1.

Registration fields for repeater form

În continuare, vă vom ghida prin pașii simpli pentru a crea o componentă repetitoare printr-un câmp derulant și logica condiționată.

3. Adăugați un câmp derulant cu opțiuni Da/Nu

Pentru a adăuga câmpul derulant în formularul dvs., puteți fie să dați clic pe el în panoul din stânga, fie să îl trageți și să plasați direct în previzualizarea formularului.

WPForms select dropdown field

După aceea, dați câmpului drop-down Etichetă un nume precum „Adăugați altul?” și apoi puteți adăuga opțiuni simple Da/Nu pentru Opțiuni .

Configure dropdown options

Apoi, vom repeta aceiași pași pentru a adăuga câmpurile Nume , E-mail și Număr de telefon sub câmpul dropdown pentru Registrant 2.

Fields below dropdown repeater form

După aceea, vom adăuga un alt câmp derulant cu aceleași opțiuni Etichetă și Da/Nu în Opțiuni pentru a crea efectul de repetitor.

Configure dropdown options

Acest lucru vă permite să creați un efect în care fiecare set ulterior de câmpuri de înregistrare utilizează logica condiționată doar pentru a afișa dacă utilizatorul a răspuns Da la „Adăugați altul?”

Dropdown field below repeater fields

Acum, trebuie să aplicăm logica condiționată câmpurilor dvs. de formular, astfel încât numai atunci când utilizatorul selectează Da în meniul dvs. derulant să apară câmpuri suplimentare pentru înregistrați.

4. Aplicați logica condiționată câmpurilor dvs. de formular

Puteți face acest lucru cu ușurință făcând clic pe orice câmp din previzualizarea corectă a formularului și navigând la fila Smart Logic sub Opțiuni câmpuri .

Smart Logic tab in field options

În meniul Smart Logic , bifați opțiunea Enable Conditional Logic pentru toate câmpurile formularului de sub „Add Another?” Câmp derulant pe care l-am creat mai devreme.

Enable conditional logic for repeater field

Apoi, utilizați logica condiționată pentru a afișa câmpul numai dacă câmpul dropdown , adică „Adăugați altul?” eu sunt „Da”. Repetați acest lucru pentru toate celelalte câmpuri de sub el.

Conditional logic show field if yes

5. Activați logica condiționată pentru câmpurile derulante

Pentru a împiedica persoana care completează formularul să adauge un al treilea solicitant cu excepția cazului în care a introdus informațiile pentru Registrant 2, va trebui să configurați o logică condiționată pentru câmpul drop-down de sub acesta.

Pentru a face acest lucru, bifați opțiunea Activare logică condiționată pentru câmpul dropdown de sub câmpurile Registrant 2 – Nume, E-mail și Telefon.

Enable conditional logic for dropdown field

Apoi, utilizați logica condiționată pentru a afișa câmpul numai dacă câmpulRegistrant 2 – Email nu este gol .Acest lucru va crea efectul de câmp repetitor.

Dropdown field is not empty

Puteți repeta pașii de mai sus de câte ori doriți pentru a obține numeroase informații despre solicitant, care se vor afișa numai dacă utilizatorul răspunde Da la „Adăugați altul?”.

Apoi, faceți clic pe butonul Salvare din colțul din dreapta sus al generatorului de formulare înainte de a trece mai departe pentru a vă asigura că niciuna dintre modificările dvs. nu se pierde.

Save the form

Suntem aproape acolo! Acum, trebuie să activăm notificările și confirmările de formulare care apar după trimiterea unui formular.

6. Activați Notificări și confirmări de formulare

Configurarea mesajelor și notificărilor care vor apărea după ce un utilizator completează și trimite formularul de înregistrare este crucială.

Acest proces este simplu. Selectați Notificări din fila Setări din ecranul Form Builder.

Form notification settings

Alertele vor fi trimise automat administratorilor. Cu toate acestea, puteți configura subiectul, corpul și lista de destinatari, dacă este necesar.

Enable form notifications for repeater field form

Mesajul pe care îl vor vedea consumatorii dumneavoastră după trimiterea formularului poate fi apoi modificat, selectând Confirmări din pagina Setări .

Form confirmation

De asemenea, puteți utiliza setarea Tip de confirmare din WPForms pentru a afișa un mesaj, a trimite link la o altă pagină sau a redirecționa utilizatorul.

Customize confirmation message for repeater field form

Buna treaba! Tot ce mai rămâne de făcut acum este să publicați formularul pe o pagină existentă sau nouă, pentru a-l face public și gata să colecteze trimiteri.

8. Publicați formularul dvs. cu câmpuri repetitoare

Creați o pagină web sau postare nouă sau modificați una existentă. După aceea, selectați pictograma WPForms făcând clic pe butonul Adăugare bloc .

Add form widget WPForms

Apoi, alegeți designul formularului de câmp repetitor din meniul drop-down din blocul WPForms pentru a-l adăuga la pagina sau postarea dvs.

Dacă doriți să personalizați aspectul formularului dvs., acum poate fi un moment bun pentru a-l modela folosind editorul de blocuri.

Repeater field form

Dacă totul pare că merge în direcția corectă, vă puteți face public formularul făcând clic pe butonul Actualizare sau Publicare .

După ce ați terminat de publicat formularul, singurul lucru care vă rămâne de făcut este să testați formularul încorporat pentru a vă asigura că funcționează conform așteptărilor pe front-end.

WPForms repeater field

Mai multe întrebări despre câmpul Repeater WPForms

Crearea formularelor de câmp repetitoare este un subiect popular de interes printre cititorii noștri. Iată câteva răspunsuri rapide la câteva dintre cele mai frecvente întrebări:

Ce este un câmp repetitor?

Un câmp repetitor este un instrument versatil, care permite utilizatorilor să adauge în mod dinamic mai multe seturi de câmpuri identice într-un formular. Imaginează-l ca pe un buton „copiere” pentru un grup de câmpuri. Îmbunătățește flexibilitatea la introducerea datelor repetabile, cum ar fi înregistrările multiple.

Cum adaug un câmp repetitor în WordPress?

De obicei, ai avea nevoie de un plugin WordPress de încredere pentru a încorpora un câmp repetitor. WPForms, un generator de formulare WordPress de nivel superior, poate fi o alegere ideală dacă doriți să adăugați un câmp repetitor la formularele dvs., fără cunoștințe de codificare sau CSS.

Ce este un câmp repetitor în WordPress?

În cadrul ecosistemului WordPress, un câmp repetitor vă permite să creați un set de sub-câmpuri care pot fi duplicate de utilizator în timp ce completează formularul. Acest lucru este util în special atunci când numărul de seturi de date repetabile nu este predefinit.

Apoi, aflați cum să creați un formular acordeon în WordPress

Căutați o modalitate simplă de a adăuga un design de formă acordeon pe site-ul dvs. WordPress? Consultați postarea noastră despre cea mai simplă metodă de a crea un formular de acordeon folosind WPForms pentru a îmbunătăți gradul de utilizare și experiența utilizatorului site-ului dvs.

Creați-vă formularul WordPress acum

Sunteți gata să vă construiți formularul? Începeți astăzi cu cel mai simplu plugin pentru generatorul de formulare WordPress. WPForms Pro include o mulțime de șabloane gratuite și oferă o garanție de rambursare a banilor de 14 zile.

Dacă acest articol v-a ajutat, vă rugăm să ne urmăriți pe Facebook și Twitter pentru mai multe tutoriale și ghiduri WordPress gratuite.