Како креирати падајуће меније у WordPress обрасцима
Падајући менији су главни радници за формуларе. Избор земље, избор категорије, рангирање преференција – кад год корисници треба да бирају са унапред дефинисане листе, падајући менији испуњавају услове. Они штеде простор, стандардизују податке и воде кориснике до валидних опција. Ево како да креирате ефикасне падајуће меније у вашим WordPress формуларима.
Зашто користити падајуће меније?
Предности у односу на текстуална поља
- Стандардизовани подаци: Без грешака у куцању или варијација
- Вођени избор: Корисници виде доступне опције
- Ефикасно у простору: Склопљено док се не кликне
- Pogodno za mobilne uređaje: Изворни бирач на телефонима
- Брже завршетак: Клик у односу на тип
Предности у односу на радио дугмад
- Боље за дугачке листе: 6+ опција се уклапа у мали простор
- Чишћи изглед: Мање визуелне гужве
- Покретно: Обради десетине опција
Када користити падајуће меније
- 6+ опција (мање = размотрите радио дугмад)
- Унапред дефинисане, познате опције
- Потребан је један избор
- Простор је ограничен
- Стандардизација података је важна
Креирање основног падајућег менија
Корак 1: Додајте падајуће поље
- Отворите свој образац у АФБ
- Наћи Дропдовн у типовима поља
- Превуците у образац
Корак 2: Конфигуришите ознаку
Ознака: „Како сте чули за нас?“ Резервисано место: „Изаберите опцију...“ Обавезно: Да/Не
Корак 3: Додајте опције
Унесите сваку опцију у нови ред:
Google претрага Друштвене мреже Пријатељ или колега Оглас Блог или чланак Друго
Корак 4: Преглед и тестирање
- Сачувај образац
- Преглед на фронтенду
- Кликните на падајући мени да бисте проверили опције
- Пошаљи тест пријаву
Опције конфигурације падајућег менија
Основна подешавања
- Лабел: Питање или подсетник
- Привремени приказ: Подразумевани текст (нпр. „Изаберите…“)
- potrebno: Морате изабрати да бисте послали
- Текст помоћи: Додатна упутства
Оптионс Сеттингс
- Листа опција: Доступне опције
- Подразумевано изабрано: Унапред изабрана опција
- Може се претраживати: Унесите текст да бисте филтрирали
- Вишеструки избор: Изаберите више
Додавање опција падајућег менија
Једноставна листа
Опција 1 Опција 2 Опција 3 Опција 4
Са вредностима које се разликују од ознака
Једно изложите, друго сачувајте:
Приказ: „Сједињене Америчке Државе“ Вредност: „САД“ Приказ: „Уједињено Краљевство“ Вредност: „УК“
Груписане опције (Optgroups)
--- Северна Америка --- Сједињене Америчке Државе Канада Мексико --- Европа --- Уједињено Краљевство Немачка Француска
Много опција
За дугачке листе, размотрите:
- Абецедни редослед
- Најчешће опције прво
- Омогућено претраживање
- Логичке групе
Текст чувара места
Шта је резервисано место?
Текст који се приказује пре него што корисник изабере опцију:
[Изаберите опцију... ▼] ← Привремени знак
Добри примери резервисаних места
„Изаберите своју земљу...“ „Изаберите категорију...“ „Изаберите временски интервал...“ „-- Молимо изаберите --“ „Изаберите једно“
Најбоље праксе за резервисано место
- Нека буде кратко
- Јасно ставите до знања да је то промпт
- Не користити као валидну опцију
- Размотрите формат „– Изаберите –“
Претраживи падајући менији
Шта је претраживо?
Корисници могу да куцају да би филтрирали опције:
[Укуцајте да бисте претражили... ▼] Кориснички типови: „ger“ Приказује: Немачка, Алжир, Нигер
Када омогућити претраживо
- 20+ опција
- Листе земаља/држава
- Каталози производа
- Било која дугачка листа
Омогућавање претраживости
- Изаберите падајуће поље
- Пронађите опцију „Претраживо“
- Укључи
Претраживо корисничко искуство
1. Корисник кликће на падајући мени 2. Појављује се унос текста 3. Корисник уноси делимично подударање 4. Филтер опција у реалном времену 5. Корисник бира са филтриране листе
Падајући менији за вишеструки избор
Један наспрам вишеструког избора
Један избор: Корисник бира ЈЕДНУ опцију Вишеструки избор: Корисник бира ВИШЕ опција
Када користити вишеструки избор
- „Изаберите све што се односи“
- Вишеструка интересовања/преференције
- Избор више категорија
- Када би поља за потврду заузимала превише простора
Омогућавање вишеструког избора
- Изаберите падајуће поље
- Пронађите „Дозволи вишеструке изборе“
- Укључи
Изглед са вишеструким избором
[Веб дизајн, SEO, маркетинг ▼] Одабране ставке приказане као ознаке/чипови
Вишеструки избор са ограничењима
Комбинујте са избором мин/макс:
„Изаберите 2-4 теме“ Мин: 2 Макс: 4
Примери конфигурације
Пример 1: Избор земље
Ознака: „Земља“ Резервисано место: „Изаберите своју земљу...“ Претраживо: Да Обавезно: Да Опције: [195+ земаља по абецедном реду]
Пример 2: Тип упита
Ознака: „О чему се ради у вашем упиту?“ Резервисано место: „Изаберите категорију...“ Обавезно: Да Опције: - Продаја - Подршка - Наплата - Партнерство - Штампа/Медији - Остало
Пример 3: Распон буџета
Ознака: „Колики је ваш буџет?“ Чувар места: „Изаберите опсег...“ Обавезно: Не Опције: - Испод 1,000 долара - 1,000 долара - 5,000 долара - 5,000 долара - 10,000 долара - 10,000 долара - 25,000 долара - преко 25,000 долара - Још нисам сигуран
Пример 4: Временски интервал
Ознака: „Жељено време заказивања“ Чувар места: „Изаберите време...“ Обавезно: Да Опције: - 9:00 - 10:00 - 11:00 - 1:00 - 2:00 - 3:00 - 4:00
Пример 5: Вишеструки избор интересовања
Ознака: „Теме од интереса“ Чувар места: „Изаберите теме...“ Вишеструки избор: Да Претраживо: Да Опције: - Технологија - Пословање - Маркетинг - Дизајн - Развој - Аналитика - Безбедност - Вештачка интелигенција/машинско учење
Пример 6: Груписане услуге
Ознака: „Која услуга вам је потребна?“ Опције: --- Веб услуге --- - Дизајн веб сајтова - Развој веб сајтова - Е-трговина --- Маркетинг --- - SEO - PPC - Друштвене мреже --- Подршка --- - Одржавање - Хостинг - Консалтинг
Подразумевани избор
Без подразумеваних вредности (препоручено)
[Изаберите опцију... ▼]
Корисник мора активно да изабере. Најбоље за обавезна поља.
Унапред изабрано подразумевано
[Сједињене Америчке Државе ▼] ← Унапред одабрано
Користите када:
- Једна опција је изузетно уобичајена
- Убрзава попуњавање формулара
- Постоји логичка подразумевана вредност
Подразумевано подешавање
- На листи опција означите подразумевану опцију
- Или подесите „Подразумевана вредност“ у подешавањима
Падајући мени наспрам радио дугмади
Користите падајући мени када
- 6+ опција
- Дуга листа (земље, државе)
- Простор је ограничен
- Опције су сличне природе
Користите радио дугмад када
- 2-5 опције
- Све опције би требало да буду видљиве
- Опције имају описе
- Визуелно поређење је важно
Упоредно поређење
ПАДАЈУЋИ МЕНИ (6+ опција, скривено док се не кликне): [Изаберите план... ▼] РАДИО ДУГМАД (2-5 опција, све видљиве): ○ Бесплатно ○ Основно (9 долара/месечно) ○ Професионално (29 долара/месечно) ○ Пословно (Контактирајте нас)
Падајући менији за стилизовање
Подразумевани изглед
Падајући менији наслеђују стил форме:
- Боја/полупречник ивице
- Боја позадине
- Породица/величина фонта
- паддинг
Прилагођене опције стилизовања
- Икона падајуће стрелице
- Изглед изабране ставке
- Стања лебдења опције изнад ње
- Стилизовање ознака за вишеструки избор
Мобилни стил
Падајући менији за мобилне уређаје:
- iOS: Бирач точка
- Андроид: Бирач материјала
- У складу са ОС-ом
Најбоље праксе
1. Логично наручите опције
- Абецедно: Земље, имена
- Нумерички: Количине, распони
- Фреквенција: Најчешће прво
- Хронолошки: Временски термини, датуми
2. Опције треба да буду сажете
Добро: „Сједињене Америчке Државе“ Избегавајте: „Сједињене Америчке Државе (САД)“ Добро: „1,000 - 5,000 долара“ Избегавајте: „Између хиљаду и пет хиљада долара“
3. Укључите „Остало“ када је то прикладно
Опције: - Google - Facebook - LinkedIn - Препорука пријатеља - Остало ← Хвата граничне случајеве
4. Користите резервисано место, а не прву опцију
Добро: Привремено резервисано: „Изаберите...“ Опције: Опција 1, Опција 2, Опција 3 Избегавајте: Опције: „Изаберите...“, Опција 1, Опција 2 (Прва опција не би требало да буде промпт)
5. Омогућите претрагу за дугачке листе
Било који падајући мени са 15-20+ опција требало би да буде претражив.
6. Размотрите перформансе учитавања
За изузетно дугачке листе (1000+) може бити потребно:
- Лази лоадинг
- Претрага на страни сервера
- Подела на подкатегорије
Уобичајени случајеви употребе падајућих менија
Формулари за контакт
- Одељење (продаја, подршка, наплата) - Врста упита (питање, повратне информације, жалба) - Како сте чули за нас
Обрасци за регистрацију
- Земља - Држава/Покрајина - Индустрија - Величина компаније - Назив радног места/улога
Обрасци за наруџбу
- Избор производа - Количина - Варијанте величине/боје - Начин испоруке
Анкете
- Скале за оцењивање (1-10) - Учесталост (Никад до Увек) - Слагање (Уопште се не слажем до У потпуности се слажем)
Формулари за резервацију
- Врста услуге - Жељени датум - Временски интервал - Трајање
Решавање проблема
Падајући мени не приказује опције
- Проверите да ли су опције сачуване
- Проверите да ли је листа опција празна
- Обриши кеш и освежи
Претрага не ради
- Потврдите да је претраживост омогућена
- Проверите грешке у ЈаваСкрипту
- Тестирајте у другом прегледачу
Вишеструки избор не чува све изборе
- Проверите да ли је вишеструки избор омогућен
- Проверите руковање слањем обрасца
- Тестирајте са мање избора
Мобилни бирач се не приказује
- Прилагођени стил може да замени изворни текст
- Тестирање на стварном мобилном уређају
- Проверите да ли постоје сукоби у JavaScript-у
Приступачност
Navigacija sa tastature
- Табулација за фокусирање падајућег менија
- Тастери са стрелицама за навигацију
- Ентер/Размакница за избор
- Укуцајте прво слово да бисте скочили
Читачи екрана
- Ознака је правилно повезана
- Објављене опције
- Избор је потврђен
Најбоље праксе
- Јасне, описне етикете
- Логички редослед опција
- Избегавајте резервисано место као једину инструкцију
резиме
Креирање падајућих менија:
- Додај падајуће поље – Превуците у облик
- Постави ознаку – Јасно питање/подсетник
- Додај резервисано место – Текст „Изаберите…“
- Унесите опције – Један по реду
- Омогући претраживо – За дугачке листе
- Омогући вишеструки избор – Ако је потребно више избора
- Потребно је подесити – На основу потреба за формуларом
- Тестирајте темељно – Све опције, сви уређаји
Закључак
Падајући менији ефикасно обрађују избор опција у обрасцима. Они штеде простор, стандардизују податке и добро функционишу на различитим уређајима. За кратке листе, размотрите радио дугмад. За дугачке листе, омогућите претрагу. За вишеструке изборе користите режим вишеструког избора. Права конфигурација чини падајуће меније моћним пољима за унос која побољшавају и корисничко искуство и квалитет података.
Аутоматски креатор образаца Укључује потпуно опремљена падајућа поља са режимом претраживања, опцијом вишеструког избора и прилагођеним стилом. Направите професионалне меније за избор за неколико минута.
Спремни да додате падајуће меније? Преузмите аутоматски креатор образаца и почните да правите обрасце са падајућим менијима већ данас.