वर्डप्रेस फॉर्ममध्ये ड्रॉपडाउन मेनू कसे तयार करावे
ड्रॉपडाउन हे फॉर्म वर्कहॉर्स आहेत. देश निवड, श्रेणी निवड, पसंती क्रमवारी - जेव्हा जेव्हा वापरकर्त्यांना पूर्वनिर्धारित यादीतून निवड करायची असते तेव्हा ड्रॉपडाउन वितरित करतात. ते जागा वाचवतात, डेटा प्रमाणित करतात आणि वापरकर्त्यांना वैध पर्यायांकडे मार्गदर्शन करतात. तुमच्या वर्डप्रेस फॉर्ममध्ये प्रभावी ड्रॉपडाउन मेनू कसे तयार करायचे ते येथे आहे.
ड्रॉपडाउन मेनू का वापरावे?
मजकूर फील्डपेक्षा फायदे
- प्रमाणित डेटा: कोणत्याही टायपिंगच्या चुका किंवा फरक नाहीत
- मार्गदर्शित निवड: वापरकर्ते उपलब्ध पर्याय पाहतात
- जागा कार्यक्षम: क्लिक होईपर्यंत कोलॅप्स केले
- मोबाईल फ्रेंडली: फोनवर मूळ निवडक
- जलद पूर्णता: क्लिक विरुद्ध प्रकार
रेडिओ बटणांपेक्षा फायदे
- लांब यादींसाठी चांगले: लहान जागेत ६+ पर्याय बसतात
- स्वच्छ देखावा: कमी दृश्यमान गोंधळ
- स्क्रोल करण्यायोग्य: डझनभर पर्याय हाताळा
ड्रॉपडाउन कधी वापरायचे
- ६+ पर्याय (कमी = रेडिओ बटणे विचारात घ्या)
- पूर्वनिर्धारित, ज्ञात पर्याय
- एकच निवड आवश्यक आहे
- जागा मर्यादित आहे
- डेटा मानकीकरण महत्वाचे
मूलभूत ड्रॉपडाउन तयार करणे
पायरी १: ड्रॉपडाउन फील्ड जोडा
- तुमचा फॉर्म येथे उघडा A.F.B.
- शोधणे ड्रॉपडाउन शेताच्या प्रकारांमध्ये
- तुमच्या फॉर्मवर ड्रॅग करा
पायरी २: लेबल कॉन्फिगर करा
लेबल: "तुम्हाला आमच्याबद्दल कसे कळले?" प्लेसहोल्डर: "एक पर्याय निवडा..." आवश्यक: हो/नाही
पायरी ३: पर्याय जोडा
प्रत्येक पर्याय नवीन ओळीवर प्रविष्ट करा:
गुगल सर्च सोशल मीडिया मित्र किंवा सहकारी जाहिरात ब्लॉग किंवा लेख इतर
पायरी ५: पूर्वावलोकन आणि चाचणी
- फॉर्म जतन करा
- फ्रंटएंडवरील पूर्वावलोकन
- पर्यायांची पडताळणी करण्यासाठी ड्रॉपडाउनवर क्लिक करा.
- चाचणी नोंद सबमिट करा
ड्रॉपडाउन कॉन्फिगरेशन पर्याय
मूलभूत सेटिंग्ज
- लेबलः प्रश्न किंवा सूचना
- प्लेसहोल्डर: डीफॉल्ट मजकूर (उदा., "निवडा...")
- आवश्यक: सबमिट करण्यासाठी निवडणे आवश्यक आहे
- मदत मजकूर: अतिरिक्त सूचना
पर्याय सेटिंग्ज
- पर्यायांची यादी: उपलब्ध पर्याय
- डीफॉल्ट निवडले: पूर्व-निवडलेला पर्याय
- शोधण्यायोग्य: फिल्टर करण्यासाठी टाइप करा
- एकाधिक-निवड: अनेक निवडा
ड्रॉपडाउन पर्याय जोडत आहे
साध्या यादी
पर्याय १ पर्याय २ पर्याय ३ पर्याय ४
लेबलांपेक्षा वेगळी मूल्ये असलेले
एक गोष्ट दाखवा, दुसरी साठवा:
प्रदर्शन: "युनायटेड स्टेट्स" मूल्य: "यूएस" प्रदर्शन: "युनायटेड किंग्डम" मूल्य: "यूके"
गटबद्ध पर्याय (ऑप्टग्रुप)
--- उत्तर अमेरिका --- युनायटेड स्टेट्स कॅनडा मेक्सिको --- युरोप --- युनायटेड किंग्डम जर्मनी फ्रान्स
बरेच पर्याय
लांब यादींसाठी, विचारात घ्या:
- वर्णक्रमानुसार
- सर्वात सामान्य पर्याय प्रथम
- शोधण्यायोग्य सक्षम केले
- तार्किक गट
प्लेसहोल्डर मजकूर
प्लेसहोल्डर म्हणजे काय?
वापरकर्ता पर्याय निवडण्यापूर्वी दाखवलेला मजकूर:
[एक पर्याय निवडा... ▼] ← प्लेसहोल्डर
चांगले प्लेसहोल्डर उदाहरणे
"तुमचा देश निवडा..." "एक श्रेणी निवडा..." "वेळ स्लॉट निवडा..." "-- कृपया निवडा --" "एक निवडा"
प्लेसहोल्डर सर्वोत्तम पद्धती
- ते लहान ठेवा
- हे एक सूचना आहे हे स्पष्ट करा.
- वैध पर्याय म्हणून वापरू नका
- “– निवडा –” स्वरूप विचारात घ्या.
शोधण्यायोग्य ड्रॉपडाउन
शोधण्यायोग्य म्हणजे काय?
वापरकर्ते फिल्टर पर्याय टाइप करू शकतात:
[शोधण्यासाठी टाइप करा... ▼] वापरकर्ता प्रकार: "ger" शो: जर्मनी, अल्जेरिया, नायजर
शोधण्यायोग्य कधी सक्षम करायचे
- १२+ पर्याय
- देश/राज्य सूची
- उत्पादन कॅटलॉग
- कितीही लांब यादी असो
शोधण्यायोग्य सक्षम करणे
- ड्रॉपडाउन फील्ड निवडा
- "शोधण्यायोग्य" पर्याय शोधा
- टॉगल चालू करा
शोधण्यायोग्य UX
१. वापरकर्ता क्लिक्स ड्रॉपडाउन २. मजकूर इनपुट दिसतो ३. वापरकर्ता प्रकार आंशिक जुळणी ४. रिअल-टाइममध्ये पर्याय फिल्टर ५. वापरकर्ता फिल्टर केलेल्या सूचीमधून निवडतो
मल्टी-सिलेक्ट ड्रॉपडाउन
सिंगल विरुद्ध मल्टी-सिलेक्ट
एकच निवड: वापरकर्ता एक पर्याय निवडतो बहु-निवड: वापरकर्ता अनेक पर्याय निवडतो
मल्टी-सिलेक्ट कधी वापरावे
- "लागू असलेले सर्व निवडा"
- अनेक आवडी/प्राधान्ये
- अनेक श्रेणी निवडणे
- जेव्हा चेकबॉक्स जास्त जागा घेतील
मल्टी-सिलेक्ट सक्षम करणे
- ड्रॉपडाउन फील्ड निवडा
- "एकाधिक निवडींना परवानगी द्या" शोधा.
- टॉगल चालू करा
मल्टी-सिलेक्ट अपिअरन्स
[वेब डिझाइन, एसइओ, मार्केटिंग ▼] निवडलेले आयटम टॅग/चिप्स म्हणून दाखवले आहेत.
मर्यादांसह मल्टी-सिलेक्ट
किमान/कमाल निवडीसह एकत्र करा:
"२-४ विषय निवडा" किमान: २ कमाल: ४
कॉन्फिगरेशन उदाamples
उदाहरण १: देश निवड
लेबल: "देश" प्लेसहोल्डर: "तुमचा देश निवडा..." शोधण्यायोग्य: हो आवश्यक: हो पर्याय: [१९५+ देश वर्णक्रमानुसार]
उदाहरण २: चौकशीचा प्रकार
लेबल: "तुमची चौकशी कशाबद्दल आहे?" प्लेसहोल्डर: "श्रेणी निवडा..." आवश्यक: होय पर्याय: - विक्री - समर्थन - बिलिंग - भागीदारी - प्रेस/मीडिया - इतर
उदाहरण ३: बजेट श्रेणी
लेबल: "तुमचे बजेट किती आहे?" प्लेसहोल्डर: "श्रेणी निवडा..." आवश्यक: कोणतेही पर्याय नाहीत: - $१,००० पेक्षा कमी - $१,००० - $५,००० - $५,००० - $१०,००० - $१०,००० - $२५,००० - $२५,०००+ - अजून खात्री नाही
उदाहरण ४: वेळेचा स्लॉट
लेबल: "पसंतीची भेटीची वेळ" प्लेसहोल्डर: "वेळ निवडा..." आवश्यक: हो पर्याय: - सकाळी ९:०० - सकाळी १०:०० - सकाळी ११:०० - दुपारी १:०० - दुपारी २:०० - दुपारी ३:०० - दुपारी ४:००
उदाहरण ५: बहु-निवडक स्वारस्ये
लेबल: "आवडीचे विषय" प्लेसहोल्डर: "विषय निवडा..." मल्टी-सिलेक्ट: होय शोधण्यायोग्य: होय पर्याय: - तंत्रज्ञान - व्यवसाय - मार्केटिंग - डिझाइन - विकास - विश्लेषण - सुरक्षा - एआय/एमएल
उदाहरण ६: गटबद्ध सेवा
लेबल: "तुम्हाला कोणती सेवा हवी आहे?" पर्याय: --- वेब सेवा --- - वेबसाइट डिझाइन - वेबसाइट डेव्हलपमेंट - ई-कॉमर्स --- मार्केटिंग --- - एसइओ - पीपीसी - सोशल मीडिया --- सपोर्ट --- - देखभाल - होस्टिंग - कन्सल्टिंग
डीफॉल्ट निवड
डीफॉल्ट नाही (शिफारस केलेले)
[एक पर्याय निवडा... ▼]
वापरकर्त्याने सक्रियपणे निवड करावी. आवश्यक फील्डसाठी सर्वोत्तम.
पूर्व-निवडलेले डीफॉल्ट
[युनायटेड स्टेट्स ▼] ← पूर्व-निवडलेले
जेव्हा वापरा:
- एक पर्याय अत्यंत सामान्य आहे.
- फॉर्म पूर्ण करण्याची गती वाढवते
- लॉजिकल डीफॉल्ट अस्तित्वात आहे
डीफॉल्ट सेट करत आहे
- पर्यायांच्या यादीमध्ये, डीफॉल्ट पर्याय म्हणून चिन्हांकित करा
- किंवा सेटिंग्जमध्ये "डीफॉल्ट मूल्य" सेट करा.
ड्रॉपडाउन विरुद्ध रेडिओ बटणे
ड्रॉपडाउन वापरा जेव्हा
- १२+ पर्याय
- लांब यादी (देश, राज्ये)
- जागा मर्यादित आहे
- पर्याय निसर्गात समान आहेत
जेव्हा रेडिओ बटणे वापरा
- ३-४ पर्याय
- सर्व पर्याय दृश्यमान असले पाहिजेत
- पर्यायांमध्ये वर्णने आहेत
- दृश्य तुलना महत्त्वाची
शेजारी शेजारी तुलना
ड्रॉपडाऊन (६+ पर्याय, क्लिक करेपर्यंत लपवलेले): [योजना निवडा... ▼] रेडिओ बटणे (२-५ पर्याय, सर्व दृश्यमान): ○ मोफत ○ बेसिक ($९/महिना) ○ प्रो ($२९/महिना) ○ एंटरप्राइझ (आमच्याशी संपर्क साधा)
स्टायलिंग ड्रॉपडाउन
डीफॉल्ट स्वरूप
ड्रॉपडाउन फॉर्म स्टाईलिंगला वारसा देतात:
- बॉर्डरचा रंग/त्रिज्या
- पार्श्वभूमी रंग
- फॉन्ट फॅमिली/आकार
- पॅडिंग
कस्टम स्टाइलिंग पर्याय
- ड्रॉपडाउन बाण चिन्ह
- निवडलेल्या आयटमचे स्वरूप
- पर्याय होव्हर स्थिती
- मल्टी-सिलेक्ट टॅग स्टायलिंग
मोबाईल स्टायलिंग
मूळ मोबाइल ड्रॉपडाउन:
- iOS: व्हील पिकर
- अँड्रॉइड: मटेरियल पिकर
- ओएसशी सुसंगत
चांगला सराव
३. पर्याय तार्किकदृष्ट्या ऑर्डर करा
- वर्णक्रमानुसार: देश, नावे
- संख्यात्मक: प्रमाण, श्रेणी
- वारंवारता: सर्वात सामान्य प्रथम
- कालक्रमानुसार: वेळ स्लॉट, तारखा
२. पर्याय संक्षिप्त ठेवा
चांगले: "युनायटेड स्टेट्स" टाळा: "युनायटेड स्टेट्स ऑफ अमेरिका (यूएसए)" चांगले: "$१,००० - $५,०००" टाळा: "एक हजार ते पाच हजार डॉलर्स दरम्यान"
६. योग्य असेल तेव्हा "इतर" समाविष्ट करा
पर्याय: - गुगल - फेसबुक - लिंक्डइन - मित्रांचा संदर्भ - इतर ← एज केसेस पकडते
४. प्लेसहोल्डर वापरा, पहिला पर्याय नाही
चांगले: प्लेसहोल्डर: "निवडा..." पर्याय: पर्याय १, पर्याय २, पर्याय ३ टाळा: पर्याय: "निवडा...", पर्याय १, पर्याय २ (पहिला पर्याय प्रॉम्प्ट नसावा)
६. लांब सूचींसाठी शोध सक्षम करा
१५-२०+ पर्याय असलेले कोणतेही ड्रॉपडाउन शोधण्यायोग्य असले पाहिजे.
६. लोडिंग कामगिरीचा विचार करा
खूप लांब यादी (१०००+) साठी आवश्यक असू शकते:
- आळशी लोडिंग
- सर्व्हर-साइड शोध
- उपवर्गांमध्ये विभागणे
सामान्य ड्रॉपडाउन वापर प्रकरणे
संपर्क फॉर्म
- विभाग (विक्री, समर्थन, बिलिंग) - चौकशीचा प्रकार (प्रश्न, अभिप्राय, तक्रार) - तुम्हाला आमच्याबद्दल कसे कळले?
नोंदणी फॉर्म
- देश - राज्य/प्रांत - उद्योग - कंपनीचा आकार - नोकरीचे शीर्षक/भूमिका
ऑर्डर फॉर्म
- उत्पादन निवड - प्रमाण - आकार/रंग प्रकार - शिपिंग पद्धत
सर्वेक्षण फॉर्म
- रेटिंग स्केल (१-१०) - वारंवारता (कधीही नाही ते नेहमीच नाही) - सहमती (पूर्णपणे असहमत ते पूर्णपणे सहमत)
बुकिंग फॉर्म
- सेवेचा प्रकार - पसंतीची तारीख - वेळ स्लॉट - कालावधी
समस्यानिवारण
ड्रॉपडाउन पर्याय दाखवत नाही
- पर्याय सेव्ह केले आहेत का ते पडताळून पहा
- रिकाम्या पर्यायांची यादी तपासा.
- कॅशे साफ करा आणि रिफ्रेश करा
शोध कार्य करत नाही
- शोधण्यायोग्य सक्षम केले आहे याची पुष्टी करा
- जावास्क्रिप्ट त्रुटी तपासा
- वेगवेगळ्या ब्राउझरमध्ये चाचणी करा
सर्व निवडी जतन न करणे बहु-निवड
- मल्टी-सिलेक्ट सक्षम आहे का ते पडताळून पहा
- फॉर्म सबमिशन हाताळणी तपासा
- कमी निवडींसह चाचणी करा
मोबाईल पिकर दिसत नाहीये.
- कस्टम स्टाइल मूळ शैलीला ओव्हरराइड करू शकते
- प्रत्यक्ष मोबाइल डिव्हाइसवर चाचणी करा
- जावास्क्रिप्ट संघर्ष तपासा
प्रवेश
कीबोर्ड नेव्हिगेशन
- फोकस करण्यासाठी टॅब ड्रॉपडाउन
- नेव्हिगेट करण्यासाठी बाण की
- निवडण्यासाठी एंटर/स्पेस करा
- उडी मारण्यासाठी पहिले अक्षर टाइप करा
स्क्रीन रीडर्स
- लेबल योग्यरित्या जोडलेले आहे
- पर्याय जाहीर केले
- निवड निश्चित झाली
चांगला सराव
- स्पष्ट, वर्णनात्मक लेबल्स
- तार्किक पर्याय क्रम
- प्लेसहोल्डर फक्त सूचना म्हणून टाळा
सारांश
ड्रॉपडाउन मेनू तयार करणे:
- ड्रॉपडाउन फील्ड जोडा - तयार करण्यासाठी ड्रॅग करा
- लेबल सेट करा - स्पष्ट प्रश्न/सूचना
- प्लेसहोल्डर जोडा – “निवडा…” मजकूर
- पर्याय एंटर करा - प्रत्येक ओळीत एक
- शोधण्यायोग्य सक्षम करा - लांब यादीसाठी
- मल्टी-सिलेक्ट सक्षम करा - जर अनेक पर्यायांची आवश्यकता असेल तर
- सेट आवश्यक आहे - फॉर्मच्या गरजांवर आधारित
- कसून चाचणी घ्या - सर्व पर्याय, सर्व उपकरणे
निष्कर्ष
ड्रॉपडाउन फॉर्ममधील पर्याय निवड कार्यक्षमतेने हाताळतात. ते जागा वाचवतात, डेटा प्रमाणित करतात आणि सर्व डिव्हाइसेसवर चांगले कार्य करतात. लहान सूचींसाठी, रेडिओ बटणे विचारात घ्या. लांब सूचींसाठी, शोध सक्षम करा. एकाधिक निवडींसाठी, मल्टी-सिलेक्ट मोड वापरा. योग्य कॉन्फिगरेशन ड्रॉपडाउनला शक्तिशाली इनपुट फील्ड बनवते जे वापरकर्ता अनुभव आणि डेटा गुणवत्ता दोन्ही सुधारते.
ऑटो फॉर्म बिल्डर शोधण्यायोग्य मोड, मल्टी-सिलेक्ट पर्याय आणि कस्टम स्टाइलिंगसह पूर्णपणे वैशिष्ट्यीकृत ड्रॉपडाउन फील्ड समाविष्ट आहेत. काही मिनिटांत व्यावसायिक निवड मेनू तयार करा.
ड्रॉपडाउन जोडण्यास तयार आहात का? ऑटो फॉर्म बिल्डर डाउनलोड करा आणि आजच ड्रॉपडाउन मेनू वापरून फॉर्म तयार करायला सुरुवात करा.