Kako stvoriti padajuće izbornike u WordPress obrascima

Kako stvoriti padajuće izbornike u WordPress obrascima

Padajući izbornici su glavni alati za izradu obrazaca. Odabir države, odabir kategorije, rangiranje preferencija - kad god korisnici trebaju birati s unaprijed definiranog popisa, padajući izbornici ispunjavaju očekivanja. Štede prostor, standardiziraju podatke i vode korisnike do valjanih opcija. Evo kako stvoriti učinkovite padajuće izbornike u vašim WordPress obrascima.

Zašto koristiti padajuće izbornike?

Prednosti u odnosu na tekstualna polja

  • Standardizirani podaci: Nema tipografskih pogrešaka ili varijacija
  • Vođeni odabir: Korisnici vide dostupne opcije
  • Prostorno učinkovito: Sažeto dok se ne klikne
  • Prilagođeno mobilnim uređajima: Izvorni alat za odabir na telefonima
  • Brže dovršavanje: Klik u odnosu na vrstu

Prednosti u odnosu na radio gumbe

  • Bolje za duge popise: 6+ opcija stane u mali prostor
  • Čišći izgled: Manje vizualnog nereda
  • Pomicanje: Obradite desetke opcija

Kada koristiti padajuće izbornike

  • 6+ opcija (manje = razmislite o radio gumbima)
  • Unaprijed definirane, poznate opcije
  • Potreban je jedan odabir
  • Prostor je ograničen
  • Standardizacija podataka je važna

Izrada osnovnog padajućeg izbornika

Korak 1: Dodajte padajuće polje

  1. Otvorite svoj obrazac u A.F.B.
  2. naći padajući u vrstama polja
  3. Povucite u obrazac

Korak 2: Konfigurirajte oznaku

Oznaka: "Kako ste čuli za nas?" Rezervirano mjesto: "Odaberite opciju..." Obavezno: Da/Ne

Korak 3: Dodajte opcije

Svaku opciju unesite u novi redak:

Google pretraga Društveni mediji Prijatelj ili kolega Oglas Blog ili članak Ostalo

Korak 4: Pregled i testiranje

  1. Spremi obrazac
  2. Pregled na frontendu
  3. Kliknite padajući izbornik za provjeru opcija
  4. Pošaljite testni unos

Opcije konfiguracije padajućeg izbornika

Osnovne postavke

  • Label: Pitanje ili uputa
  • Rezervirano mjesto: Zadani tekst (npr. „Odaberi…“)
  • Potreban: Morate odabrati za slanje
  • Tekst pomoći: Dodatne upute

Postavke opcija

  • Popis opcija: Dostupni izbori
  • Zadano odabrano: Unaprijed odabrana opcija
  • Pretraživo: Upišite za filtriranje
  • Višestruki odabir: Odaberite više

Dodavanje opcija padajućeg izbornika

Jednostavan popis

Opcija 1 Opcija 2 Opcija 3 Opcija 4

S vrijednostima različitim od oznaka

Jedno izložite, drugo pohranite:

Prikaz: "Sjedinjene Američke Države" Vrijednost: "SAD" Prikaz: "Ujedinjeno Kraljevstvo" Vrijednost: "UK"

Grupirane opcije (Optgroups)

--- Sjeverna Amerika --- Sjedinjene Američke Države Kanada Meksiko --- Europa --- Ujedinjeno Kraljevstvo Njemačka Francuska

Mnoge mogućnosti

Za duge popise, razmotrite:

  • Abecedni red
  • Najčešće opcije prvo
  • Omogućeno pretraživanje
  • Logičke grupe

Tekst rezerviranog mjesta

Što je rezervirano mjesto?

Tekst prikazan prije nego što korisnik odabere opciju:

[Odaberite opciju... ▼] ← Rezervirano mjesto

Dobri primjeri rezerviranih mjesta

"Odaberite svoju državu..." "Odaberite kategoriju..." "Odaberite vremenski interval..." "-- Molimo odaberite --" "Odaberite jedno"

Najbolje prakse za rezervirana mjesta

  • Neka bude kratko
  • Jasno stavite do znanja da je to upit
  • Ne koristiti kao valjanu opciju
  • Razmotrite format "– Odaberi –"

Padajući izbornici koji se mogu pretraživati

Što je pretraživo?

Korisnici mogu upisivati ​​za filtriranje opcija:

[Upišite za pretraživanje... ▼] Korisnički tipovi: "ger" Prikazuje: Njemačka, Alžir, Niger

Kada omogućiti pretraživanje

  • 20+ opcija
  • Popisi država/saveznih država
  • Katalozi proizvoda
  • Bilo koji dugi popis

Omogućavanje pretraživosti

  1. Odaberite padajuće polje
  2. Pronađi opciju "Pretraživo"
  3. Uključite

Pretraživo korisničko iskustvo

1. Korisnik klikne padajući izbornik 2. Pojavi se unos teksta 3. Korisnik upisuje djelomično podudaranje 4. Opcije se filtriraju u stvarnom vremenu 5. Korisnik odabire s filtriranog popisa

Padajući izbornik s višestrukim odabirom

Jedan vs. višestruki odabir

Jedan odabir: Korisnik bira JEDNU opciju Višestruki odabir: Korisnik bira VIŠE opcija

Kada koristiti višestruki odabir

  • "Odaberite sve što se odnosi na vas"
  • Višestruki interesi/preferencije
  • Odabir više kategorija
  • Kada bi potvrdne kućice zauzimale previše prostora

Omogućavanje višestrukog odabira

  1. Odaberite padajuće polje
  2. Pronađite "Dopusti višestruke odabire"
  3. Uključite

Izgled s višestrukim odabirom

[Web dizajn, SEO, Marketing ▼] Odabrane stavke prikazane kao oznake/čipovi

Višestruki odabir s ograničenjima

Kombinirajte s odabirom min/maks:

"Odaberite 2-4 teme" Min: 2 Maks: 4

Primjeri konfiguracije

Primjer 1: Odabir države

Oznaka: "Država" Rezervirano mjesto: "Odaberite svoju državu..." Pretraživo: Da Obavezno: Da Opcije: [195+ država abecednim redom]

Primjer 2: Vrsta upita

Oznaka: "O čemu se radi u vašem upitu?" Rezervirano mjesto: "Odaberite kategoriju..." Obavezno: Da Opcije: - Prodaja - Podrška - Naplata - Partnerstvo - Tisak/Mediji - Ostalo

Primjer 3: Raspon proračuna

Oznaka: "Koliki je vaš proračun?" Rezervirano mjesto: "Odaberite raspon..." Obavezno: Ne Opcije: - Ispod 1,000 USD - 1,000 USD - 5,000 USD - 5,000 USD - 10 000 USD - 10 000 USD - 25 000 USD - 25 000 USD+ - Nisam još siguran

Primjer 4: Vremenski interval

Oznaka: "Željeno vrijeme sastanka" Rezervirano mjesto: "Odaberite vrijeme..." Obavezno: Da Opcije: - 9:00 - 10:00 - 11:00 - 1:00 - 2:00 - 3:00 - 4:00

Primjer 5: Višestruki odabir interesa

Oznaka: "Teme od interesa" Rezervirano mjesto: "Odaberi teme..." Višestruki odabir: Da Pretraživo: Da Opcije: - Tehnologija - Poslovanje - Marketing - Dizajn - Razvoj - Analitika - Sigurnost - AI/ML

Primjer 6: Grupirane usluge

Oznaka: "Koja vam je usluga potrebna?" Opcije: --- Web usluge --- - Dizajn web stranica - Razvoj web stranica - E-trgovina --- Marketing --- - SEO - PPC - Društveni mediji --- Podrška --- - Održavanje - Hosting - Savjetovanje

Zadani odabir

Bez zadanih postavki (preporučeno)

[Odaberite opciju... ▼]

Korisnik mora aktivno odabrati. Najbolje za obavezna polja.

Unaprijed odabrana zadana vrijednost

[Sjedinjene Američke Države ▼] ← Unaprijed odabrano

Koristiti kada:

  • Jedna opcija je izuzetno uobičajena
  • Ubrzava ispunjavanje obrazaca
  • Postoji logička zadana vrijednost

Zadana postavka

  1. Na popisu opcija označite zadanu opciju
  2. Ili postavite "Zadana vrijednost" u postavkama

Padajući izbornik u odnosu na radio gumbe

Koristite padajući izbornik kada

  • 6+ opcija
  • Dugi popis (zemlje, savezne države)
  • Prostor je ograničen
  • Opcije su slične prirode

Koristite radio gumbe kada

  • 2-5 opcije
  • Sve opcije trebaju biti vidljive
  • Opcije imaju opise
  • Vizualna usporedba je važna

Usporedna usporedba

PADAJUĆI IZBORNIK (6+ opcija, skriveno dok se ne klikne): [Odaberite plan... ▼] RADIO GUMBOVI (2-5 opcija, sve vidljive): ○ Besplatno ○ Osnovno (9 USD/mj.) ○ Pro (29 USD/mj.) ○ Enterprise (Kontaktirajte nas)

Padajući izbornici za stiliziranje

Zadani izgled

Padajući izbornici nasljeđuju stil obrasca:

  • Boja/polumjer obruba
  • Boja pozadine
  • Obitelj/veličina fonta
  • punjenje

Mogućnosti prilagođenog stiliziranja

  • Ikona strelice padajućeg izbornika
  • Izgled odabrane stavke
  • Stanja zadržavanja pokazivača opcije
  • Stiliziranje oznaka s višestrukim odabirom

Mobilni stil

Padajući izbornici za izvorne mobilne uređaje:

  • iOS: Birač na kotačiću
  • Android: Alat za odabir materijala
  • U skladu s OS-om

Najbolje prakse

1. Logički poredajte opcije

  • Abecedno: Države, imena
  • Numerički: Količine, rasponi
  • Frekvencija: Najčešći prvi
  • Kronološki: Vremenski termini, datumi

2. Neka opcije budu sažete

Dobro: "Sjedinjene Američke Države" Izbjegavajte: "Sjedinjene Američke Države (SAD)" Dobro: "1,000 - 5,000 USD" Izbjegavajte: "Između tisuću i pet tisuća dolara"

3. Uključite „Ostalo“ kada je to prikladno

Mogućnosti: - Google - Facebook - LinkedIn - Preporuka prijatelja - Ostalo ← Uhvati rubne slučajeve

4. Koristite rezervirano mjesto, a ne prvu opciju

Dobro: Rezervirano mjesto: "Odaberi..." Opcije: Opcija 1, Opcija 2, Opcija 3 Izbjegavaj: Opcije: "Odaberi...", Opcija 1, Opcija 2 (Prva opcija ne bi trebala biti upit)

5. Omogućite pretraživanje dugih popisa

Bilo koji padajući izbornik s 15-20+ opcija trebao bi biti pretraživ.

6. Razmotrite performanse učitavanja

Za izuzetno duge popise (1000+) možda će biti potrebno:

  • Lijeno učitavanje
  • Pretraživanje na strani poslužitelja
  • Podjela na podkategorije

Uobičajeni slučajevi upotrebe padajućih izbornika

Obrazac za kontakt

- Odjel (Prodaja, Podrška, Naplata) - Vrsta upita (Pitanje, Povratne informacije, Pritužba) - Kako ste čuli za nas

Obrasci za registraciju

- Država - Savezna država/Pokrajina - Industrija - Veličina tvrtke - Naziv radnog mjesta/uloga

Narudžbenice

- Odabir proizvoda - Količina - Varijante veličina/boja - Način dostave

Obrasci za anketu

- Ljestvice ocjenjivanja (1-10) - Učestalost (Nikad do Uvijek) - Slaganje (Uopće se ne slažem do Potpuno se slažem)

Obrasci za rezervaciju

- Vrsta usluge - Željeni datum - Vremenski interval - Trajanje

Rješavanje problema

Padajući izbornik ne prikazuje opcije

  • Provjerite jesu li opcije spremljene
  • Provjerite je li popis opcija prazan
  • Obriši predmemoriju i osvježi

Pretraga ne radi

  • Potvrdite da je pretraživost omogućena
  • Provjerite JavaScript greške
  • Testirajte u drugom pregledniku

Višestruki odabir ne sprema sve odabire

  • Provjerite je li omogućen višestruki odabir
  • Provjerite rukovanje slanjem obrasca
  • Testirajte s manje odabira

Mobilni alat za odabir se ne prikazuje

  • Prilagođeni stil može nadjačati izvorni tekst
  • Testiranje na stvarnom mobilnom uređaju
  • Provjerite ima li JavaScript sukoba

Pristupačnost

Navigacija tipkovnicom

  • Tab za fokusiranje padajućeg izbornika
  • Tipke sa strelicama za navigaciju
  • Enter/razmaknica za odabir
  • Upišite prvo slovo za skok

Čitači zaslona

  • Oznaka je ispravno povezana
  • Najavljene opcije
  • Odabir potvrđen

Najbolje prakse

  • Jasne, opisne oznake
  • Logički redoslijed opcija
  • Izbjegavajte rezervirano mjesto kao jedinu uputu

Rezime

Izrada padajućih izbornika:

  1. Dodaj padajuće polje – Povucite u obrazac
  2. Postavi oznaku – Jasno pitanje/uputa
  3. Dodaj rezervirano mjesto – Tekst „Odaberi…“
  4. Unesite opcije – Jedan po retku
  5. Omogući pretraživanje – Za duge popise
  6. Omogući višestruki odabir – Ako je potrebno više izbora
  7. Potrebno je postaviti – Na temelju potreba obrasca
  8. Temeljito testirajte – Sve opcije, svi uređaji

Zaključak

Padajući izbornici učinkovito obrađuju odabir opcija u obrascima. Štede prostor, standardiziraju podatke i dobro funkcioniraju na svim uređajima. Za kratke popise razmislite o radio gumbima. Za duge popise omogućite pretraživanje. Za višestruke odabire koristite način višestrukog odabira. Ispravna konfiguracija čini padajuće izbornike moćnim poljima za unos koja poboljšavaju i korisničko iskustvo i kvalitetu podataka.

Automatski alat za izradu obrazaca Uključuje potpuno opremljena padajuća polja s načinom pretraživanja, opcijom višestrukog odabira i prilagođenim stilom. Izradite profesionalne izbornike za nekoliko minuta.

Spremni za dodavanje padajućih izbornika? Preuzmite Auto Form Builder i počnite izrađivati ​​obrasce s padajućim izbornicima već danas.

Ostavi komentar

Vaša adresa e-pošte neće biti objavljena. Obavezna polja su označena *