Meniuri derulante cu selecție multiplă: Alegeți mai multe opțiuni

Meniurile derulante standard obligă utilizatorii să aleagă o singură opțiune. Dar dacă trebuie să selecteze mai multe? Serviciile care îi interesează, zilele în care sunt disponibile, funcțiile pe care le doresc - multe întrebări au mai multe răspunsuri valide. Meniurile derulante cu selecție multiplă permit utilizatorilor să aleagă mai multe opțiuni dintr-un singur câmp, eficient din punct de vedere al spațiului.

În acest ghid, veți învăța cum să creați meniuri derulante cu selecție multiplă care permit utilizatorilor să aleagă mai multe opțiuni în formularele WordPress.

Ce este o listă derulantă cu selecție multiplă?

Meniu derulant standard

• Faceți clic pentru a deschide opțiunile
• Selectați O singură opțiune
• Meniul derulant se închide
• O valoare stocată

Meniu derulant cu selecție multiplă

• Faceți clic pentru a deschide opțiunile
• Selectați MAI MULTE opțiuni
• Rămâne deschis pentru mai multe selecții
• Valori multiple stocate

Diferența vizuală

Standard:

Servicii: [Design web ▼] (O singură opțiune)

Selectare multiplă:

Servicii: [Design web, SEO, Marketing ▼] (Sunt afișate mai multe opțiuni)

Când se utilizează meniurile derulante cu selecție multiplă

Perfect pentru

• Servicii interesate de: „Selectați toate serviciile de care aveți nevoie”
• Zile disponibile: „Ce zile funcționează pentru tine?”
• Caracteristici dorite: „Selectați funcțiile care vă interesează”
• Categorii: „Selectați toate opțiunile aplicabile”
• Competențe/expertiză: „Care sunt abilitățile tale?”
• Preferințe: „Selectați-vă preferințele”

Când să folosiți casetele de selectare în schimb

Ghid de decizie

• 2-6 opțiuni: Folosește casete de selectare
• 7-15 opțiuni: Meniu derulant cu selecție multiplă
• Peste 15 opțiuni: Selectare multiplă cu căutare

Crearea de liste derulante cu selecție multiplă

Pasul 1: Adăugați un câmp derulant

1. Deschideți formularul în A.F.B.
2. Trage dropdown câmp în formularul dvs.
3. Faceți clic pentru a configura setările

Pasul 2: Activați selecția multiplă

1. Găsiți opțiunea „Permiteți selecții multiple”
2. Comutați la ON
3. Meniul derulant acceptă acum opțiuni multiple

Pasul 3: Adăugați opțiuni

Introduceți fiecare opțiune pe o linie nouă:

Design web SEO Marketing de conținut Social Media Marketing prin e-mail Publicitate PPC Branding Analiză

Pasul 4: Configurați setările

• Casa de discuri: „Servicii de care sunt interesat”
• Substituent: „Selectați toate opțiunile aplicabile”
• Necesar: Comutare în funcție de nevoie
• Text de ajutor: „Țineți apăsată tasta Ctrl/Cmd pentru a selecta mai multe” (dacă este necesar)

Pasul 5: Setați limitele de selecție (opțional)

• Selecții minime: Cel puțin X opțiuni
• Selecții maxime: Nu mai mult de X opțiuni

Exemple de configurare cu selecție multiplă

Selecție de servicii

Casa de discuri: „De ce servicii sunteți interesat?”

Substituent: „Selectați toate opțiunile aplicabile”

Necesar: Da

Selecții minime: 1

Opțiuni:

• Website Design
• Dezvoltarea site-urilor web
• E-commerce
• SEO
• Redactarea conținutului
• Social Media Management
• E-mail marketing
• Publicitate cu plată
• Personalizare Grafica
• Consulting

Zile disponibile

Casa de discuri: „În ce zile ești disponibil?”

Substituent: „Selectați zilele disponibile”

Necesar: Da

Selecții minime: 1

Opțiuni:

• luni
• marţi
• miercuri
• joi
• Vineri
• Sâmbătă
• Duminică

Abilitati & Expertiză

Casa de discuri: „Alegeți-vă domeniile de expertiză”

Substituent: „Alegeți toate variantele aplicabile”

Necesar: Da

Selecții minime: 1

Selecții maxime: 5

Opțiuni:

• JavaScript
• Piton
• PHP
• Reacţiona
• Vue.js
• Node.js
• WordPress
• Baza de date de management
• DevOps
• UI / UX Design

Restricții dietetice

Casa de discuri: „Există vreo restricție alimentară?”

Substituent: „Selectați dacă este cazul”

Necesar: Nu

Opțiuni:

• Vegetarian
• Vegan
• Fără gluten
• Fără lactate
• Alergia la nuci
• Cuşer
• halal
• Fara restrictii

Preferințe de comunicare

Casa de discuri: „Cum doriți să vă contactăm?”

Substituent: „Selectați metodele preferate”

Necesar: Da

Selecții minime: 1

Opțiuni:

• E-mail
• Apel telefon
• Mesaj text
• WhatsApp
• Apel video

Interese la eveniment

Casa de discuri: „Ce sesiuni te interesează?”

Substituent: „Selectați sesiunile la care să participați”

Necesar: Da

Selecții minime: 1

Opțiuni:

• Discurs
• Atelierul A: Marketing
• Atelier B: Vânzări
• Atelier C: Tehnologie
• Discuție de grup
• Prânz de rețea
• Ceremonie de inchidere

Limite de selecție

Selecții minime

De ce să îl utilizați:

• Asigurați-vă că ați ales cel puțin o opțiune
• Necesită răspunsuri multiple
• Validați informațiile introduse semnificativ

Setările comune:

• Min 1: „Selectați cel puțin unul”
• Min 2: „Selectați cel puțin două opțiuni”
• Min 3: „Alege-ți primele 3”

Selecții maxime

De ce să îl utilizați:

• Limitați opțiunile pentru concentrare
• „Alege-ți primele 3”
• Constrângeri de resurse
• Preveniți comportamentul „selectați tot”

Setările comune:

• Max 3: „Alegeți până la 3”
• Max 5: „Selectați maximum 5”
• Numărul maxim de potriviri disponibile pentru sloturile disponibile

Mesaje de validare

• „Vă rugăm să selectați cel puțin o opțiune”
• „Vă rugăm să selectați cel puțin 3 opțiuni”
• „Puteți selecta maximum 5 opțiuni”
• „Vă rugăm să selectați între 2 și 5 opțiuni”

Considerații privind experiența utilizatorului

Instrucțiuni clare

În etichetă:

• „Selectați toate opțiunile aplicabile”
• „Alegeți mai multe opțiuni”
• „Alege-ți primele 3”

În substituent:

• „Faceți clic pentru a selecta mai multe…”
• „Selectați opțiunile…”

În textul de ajutor:

• „Puteți selecta mai multe opțiuni”
• „Selectați 1-5 opțiuni”
• „Țineți apăsată tasta Ctrl (Cmd pe Mac) pentru a selecta mai multe”

Afișează numărul selectat

Afișează câte elemente sunt selectate:

• „3 articole selectate”
• „Design web, SEO, încă 2”
• Vizualizare clară a selecțiilor curente

Deselectare ușoară

• Faceți clic pe elementul selectat pentru a deselecta
• Butonul „X” pe fiecare element selectat
• Opțiunea „Șterge tot”

Căutare liste lungi

Pentru 10+ opțiuni, adăugați căutarea:

• Tastați pentru a filtra opțiunile
• Găsiți rapid articolele
• Esențial pentru peste 20 de opțiuni

Selecție multiplă vs. alte tipuri de câmpuri

Meniu derulant cu selecție multiplă vs. casete de selectare

Alegeți Selectare multiplă când:

• 7+ opțiuni
• Spațiu limitat pentru formulare
• Nu este necesar ca toate opțiunile să fie vizibile
• Se dorește un aspect vizual mai curat

Selectați casetele de selectare când:

• 6 sau mai puține opțiuni
• Utilizatorii ar trebui să vadă toate opțiunile
• Scanarea rapidă este importantă
• Interacțiunea mai simplă este preferată

Selecție multiplă vs. Meniuri derulante multiple individuale

Abordare greșită:

Prima opțiune: [Dropdown] A doua opțiune: [Dropdown] A treia opțiune: [Dropdown]

Abordare mai bună:

Selectați opțiunile: [Meniu derulant cu selecție multiplă] (Maxim 3 selecții)

Butoane Multi-Select vs. Butoane Radio

Butoane radio = o singură selecție. Nu se utilizează niciodată pentru variante multiple.

Considerații privind dispozitivele mobile

Selecție tactilă

• Ținte mari de atingere
• Ușor de selectat/deselectat
• Feedback vizual clar

Nativ vs. Personalizat

• Selecția multiplă nativă poate fi dificilă pe mobil
• Meniurile derulante personalizate îmbunătățesc adesea experiența utilizatorului
• Luați în considerare lista de casete de selectare pe mobil

Afișarea elementelor selectate

• Afișați selecțiile clar
• Nu umpleți recipientul prea mult
• „3 selectate” vs. listarea tuturor numelor

Manipularea datelor

Cum sunt stocate datele

Selecții multiple stocate de obicei ca:

• Separate prin virgulă: „Design web, SEO, Marketing”
• Matrice: [„Design web”, „SEO”, „Marketing”]
• Înscrieri individuale per selecție

notificări prin email

În e-mailurile de notificare:

Servicii pentru care sunt interesat: - Design web - SEO - Marketing de conținut

Export CSV

Exportat ca:

• O singură coloană: „Design web, SEO, Marketing”
• Sau mai multe coloane per opțiune

Filtrarea trimiterilor

• Filtrați după selecția specifică
• Găsește-i pe toți cei care au selectat „SEO”
• Util pentru segmentare

Modele comune

Model 1: Selecție multiplă obligatorie

Servicii necesare (selectați cel puțin unul): [Meniu derulant cu selecție multiplă] Obligatoriu: Da Min: 1

Modelul 2: Selecție limitată

Alegeți cele mai importante 3 priorități: [Meniu derulant cu selecție multiplă] Min: 3 Max: 3

Model 3: Selectare multiplă opțională

Există restricții alimentare? (opțional) [Meniu derulant cu selecție multiplă] Obligatoriu: Nu

Modelul 4: „Selectați tot” cu limite

Ce funcții vă interesează? (maxim 5) [Meniu derulant cu selecție multiplă] Max: 5 Text de ajutor: „Selectați până la 5 funcții”

Accesibilitate

Navigare prin tastatură

• Tab pentru a ajunge la meniul derulant
• Taste săgeată pentru navigare prin opțiuni
• Spațiu/Enter pentru selectare/deselectare
• Tastați pentru a accesa opțiunea respectivă

Suport pentru cititor de ecran

• Anunțați „selectare multiplă” sau „alegere multiplă”
• Citiți numărul selectat
• Anunțați modificările selecției

Ștergeți etichetele

• Eticheta indică faptul că este permisă selecția multiplă
• „Selectați toate opțiunile aplicabile”
• „Alegeți mai multe opțiuni”

Sfaturi de stil

Afișarea elementelor selectate

• Etichete/cipuri pentru fiecare selecție
• Distincție vizuală clară
• Scoateți butonul de pe fiecare

Aspect derulant

• Bife de lângă elementele selectate
• Fundal evidențiat pentru opțiunile selectate
• Ștergeți stările de la cursor

Design consistent

• Potriviți alte stiluri de câmpuri de formular
• Aceeași bordură, umplere, culori
• Compatibil cu meniurile derulante individuale

Depanare

Selecțiile nu se salvează

• Verificați dacă selecția multiplă este activată
• Verificați gestionarea trimiterii formularului
• Test cu previzualizare formular

Se poate selecta doar unul

• Opțiunea de selecție multiplă nu este activată
• Verificați setările de câmp
• Este posibil să folosiți un tip de câmp greșit

Validarea nu funcționează

• Verificați setările minime/maxime
• Bifați comutatorul necesar
• Testați diferite numere de selecții

Probleme de afișare pe mobil

• Test pe un dispozitiv mobil real
• Verificați lățimea meniului derulant
• Asigurați vizibilitatea selecțiilor

Întrebări frecvente

Câte opțiuni pot selecta utilizatorii?

Implicit, nelimitat. Setați maximul dacă doriți să limitați opțiunile (de exemplu, „Alegeți până la 3”).

Ar trebui să folosesc selecție multiplă sau casete de selectare?

Casete de selectare pentru 6 sau mai puține opțiuni (toate vizibile). Selectați mai multe opțiuni pentru 7+ opțiuni sau când spațiul este limitat.

Pot solicita un număr minim de selecții?

Da. Setați selecții minime pentru a vă asigura că utilizatorii aleg cel puțin X opțiuni.

Cum sunt stocate selecțiile multiple?

De obicei, ca valori separate prin virgulă sau ca o matrice. Apare în trimiteri și exporturi ca o listă.

Pot adăuga căutarea în meniul derulant?

Mulți constructori de formulare acceptă meniuri derulante cu funcție de căutare. Esențial pentru peste 15 opțiuni.

Rezumat

Crearea derulanților cu selecție multiplă:

1. Adăugați un câmp derulant – Meniul derulant standard mai întâi
2. Activează selecția multiplă – Permite selecții multiple
3. Adăugați opțiuni – Toate opțiunile disponibile
4. Setați o etichetă clară – „Selectați toate opțiunile aplicabile”
5. Adăugați un substituent – Îndrumă utilizatorii să selecteze
6. Setați limitele de selecție – Min/max dacă este necesar
7. Adăugați text de ajutor – Explicați regulile de selecție
8. Testați temeinic – Diverse numere de selecție

Concluzie

Meniurile derulante cu selecție multiplă rezolvă elegant problema „alegeți mai multe opțiuni”. Acestea economisesc spațiu în comparație cu listele lungi de casete de selectare, mențin formularele curate și permit utilizatorilor să selecteze exact ceea ce li se aplică. Folosiți-le pentru servicii, zile, funcții, preferințe - orice întrebare în care sunt valide răspunsuri multiple, iar lista este prea lungă pentru casete de selectare.

Constructor automat de formulare acceptă liste derulante cu selecție multiplă, cu limite de selecție și opțiuni de căutare. Creați formulare flexibile care captează mai multe opțiuni într-un singur câmp ușor de utilizat.

Ești pregătit pentru formulare cu selecție multiplă? Descărcați Auto Form Builder și permite utilizatorilor să aleagă mai multe opțiuni cu ușurință.