वर्डप्रेस फॉर्म में ड्रॉपडाउन मेनू कैसे बनाएं

ड्रॉपडाउन मेनू फॉर्म का एक अभिन्न अंग हैं। देश का चयन, श्रेणी का चुनाव, वरीयता क्रम—जब भी उपयोगकर्ताओं को पूर्वनिर्धारित सूची में से कुछ चुनना होता है, ड्रॉपडाउन मेनू उनकी मदद करते हैं। ये जगह बचाते हैं, डेटा को मानकीकृत करते हैं और उपयोगकर्ताओं को सही विकल्पों तक पहुंचाते हैं। यहां बताया गया है कि आप अपने वर्डप्रेस फॉर्म में प्रभावी ड्रॉपडाउन मेनू कैसे बना सकते हैं।

ड्रॉपडाउन मेनू का उपयोग क्यों करें?

टेक्स्ट फ़ील्ड पर लाभ

• मानकीकृत डेटा: कोई टाइपो या भिन्नता नहीं।
• निर्देशित चयन: उपयोगकर्ताओं को उपलब्ध विकल्प दिखाई देते हैं
• स्थान की बचत: क्लिक किए जाने तक बंद रहेगा
• मोबाइल के अनुकूल: फ़ोन पर नेटिव पिकर
• तेजी से पूरा होना: क्लिक बनाम टाइप

रेडियो बटन की तुलना में इसके फायदे

• लंबी सूचियों के लिए बेहतर: छोटी जगह में 6 से अधिक विकल्प समाहित हो जाते हैं
• अधिक स्वच्छ रूप: कम दृश्य अव्यवस्था
• स्क्रॉल करने योग्य: दर्जनों विकल्पों को संभालें

ड्रॉपडाउन का उपयोग कब करें

• 6 या उससे अधिक विकल्प (कम विकल्प होने पर रेडियो बटन का उपयोग करें)
• पूर्वनिर्धारित, ज्ञात विकल्प
• केवल एक ही चयन आवश्यक है
• स्थान सीमित है
• डेटा मानकीकरण महत्वपूर्ण है

एक बेसिक ड्रॉपडाउन बनाना

चरण 1: ड्रॉपडाउन फ़ील्ड जोड़ें

1. अपना फ़ॉर्म खोलें एएफबी
2. खोज ड्रॉप डाउन क्षेत्र प्रकारों में
3. इसे अपने फॉर्म में खींचें

चरण 2: लेबल कॉन्फ़िगर करें

लेबल: "आपको हमारे बारे में कैसे पता चला?" प्लेसहोल्डर: "एक विकल्प चुनें..." आवश्यक: हाँ/नहीं

चरण 3: विकल्प जोड़ें

प्रत्येक विकल्प को एक नई पंक्ति में लिखें:

गूगल सर्च, सोशल मीडिया, मित्र या सहकर्मी, विज्ञापन, ब्लॉग या लेख, अन्य

चरण 4: पूर्वावलोकन और परीक्षण

1. प्रपत्र सहेजें
2. फ्रंटएंड पर पूर्वावलोकन करें
3. विकल्पों की पुष्टि करने के लिए ड्रॉपडाउन पर क्लिक करें
4. टेस्ट प्रविष्टि जमा करें

ड्रॉपडाउन कॉन्फ़िगरेशन विकल्प

मूल सेटिंग्स

• लेबल: प्रश्न या संकेत
• प्लेसहोल्डर: डिफ़ॉल्ट टेक्स्ट (उदाहरण के लिए, "चुनें...")
• आवश्यक: सबमिट करने के लिए चयन करना आवश्यक है
• सहायता पाठ: अतिरिक्त निर्देश

विकल्प सेटिंग्स

• विकल्पों की सूची: उपलब्ध विकल्प
• डिफ़ॉल्ट रूप से चयनित: पूर्व-चयनित विकल्प
• खोजने योग्य: फ़िल्टर करने के लिए टाइप करें
• बहु-चयन: एकाधिक चुनें

ड्रॉपडाउन विकल्प जोड़ना

साधारण सूची

विकल्प 1 विकल्प 2 विकल्प 3 विकल्प 4

लेबल से भिन्न मानों के साथ

एक चीज प्रदर्शित करें, दूसरी चीज संग्रहित करें:

प्रदर्शित: "संयुक्त राज्य अमेरिका" मान: "यूएस" प्रदर्शित: "यूनाइटेड किंगडम" मान: "यूके"

समूहीकृत विकल्प (ऑप्टग्रुप)

--- उत्तरी अमेरिका --- संयुक्त राज्य अमेरिका कनाडा मेक्सिको --- यूरोप --- यूनाइटेड किंगडम जर्मनी फ्रांस

कई विकल्प

लंबी सूचियों के लिए, निम्नलिखित बातों पर विचार करें:

• वर्णमाला क्रम
• सबसे पहले सबसे आम विकल्प
• खोज सक्षम
• तार्किक समूहीकरण

प्लेसहोल्डर टेक्स्ट

प्लेसहोल्डर क्या है?

उपयोगकर्ता द्वारा विकल्प चुनने से पहले प्रदर्शित होने वाला पाठ:

[एक विकल्प चुनें... ▼] ← प्लेसहोल्डर

अच्छे प्लेसहोल्डर उदाहरण

"अपना देश चुनें..." "श्रेणी चुनें..." "समय चुनें..." "-- कृपया चुनें --" "एक चुनें"

प्लेसहोल्डर सर्वोत्तम अभ्यास

• इसे छोटा रखें
• यह स्पष्ट कर दें कि यह एक प्रॉम्प्ट है।
• इसे वैध विकल्प के रूप में उपयोग न करें
• “– चुनें –” प्रारूप पर विचार करें

खोज योग्य ड्रॉपडाउन

क्या-क्या खोजा जा सकता है?

उपयोगकर्ता विकल्पों को फ़िल्टर करने के लिए टाइप कर सकते हैं:

[खोजने के लिए टाइप करें... ▼] उपयोगकर्ता ने टाइप किया: "ger" परिणाम: जर्मनी, अल्जीरिया, नाइजर

खोज योग्य सुविधा कब सक्षम करें

• 20+ विकल्प
• देश/राज्य सूचियाँ
• उत्पाद कैटलॉग
• कोई भी लंबी सूची

खोज योग्य सक्षम करना

1. ड्रॉपडाउन फ़ील्ड का चयन करें
2. "खोज योग्य" विकल्प ढूंढें
3. चालू करें

खोज योग्य यूएक्स

1. उपयोगकर्ता ड्रॉपडाउन पर क्लिक करता है। 2. टेक्स्ट इनपुट दिखाई देता है। 3. उपयोगकर्ता आंशिक मिलान टाइप करता है। 4. विकल्प रीयल-टाइम में फ़िल्टर हो जाते हैं। 5. उपयोगकर्ता फ़िल्टर की गई सूची से चयन करता है।

मल्टी-सेलेक्ट ड्रॉपडाउन

सिंगल बनाम मल्टी-सेलेक्ट

सिंगल सेलेक्ट: उपयोगकर्ता एक विकल्प चुनता है। मल्टी-सेलेक्ट: उपयोगकर्ता एकाधिक विकल्प चुनता है।

मल्टी-सेलेक्ट का उपयोग कब करें

• “लागू होने वाले सभी विकल्पों का चयन करें”
• अनेक रुचियां/पसंद
• एकाधिक श्रेणियों का चयन करना
• जब चेकबॉक्स बहुत अधिक जगह घेर लेते थे

मल्टी-सेलेक्ट को सक्षम करना

1. ड्रॉपडाउन फ़ील्ड का चयन करें
2. “एकाधिक चयन की अनुमति दें” ढूंढें
3. चालू करें

बहु-चयन उपस्थिति

[वेब डिज़ाइन, एसईओ, मार्केटिंग ▼] चयनित आइटम टैग/चिप्स के रूप में दिखाए गए हैं

सीमाओं के साथ मल्टी-सेलेक्ट

न्यूनतम/अधिकतम चयन के साथ संयोजन करें:

"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: समूहीकृत सेवाएं

लेबल: "आपको कौन सी सेवा चाहिए?" विकल्प: --- वेब सेवाएं --- - वेबसाइट डिज़ाइन - वेबसाइट विकास - ई-कॉमर्स --- मार्केटिंग --- - एसईओ - पीपीसी - सोशल मीडिया --- समर्थन --- - रखरखाव - होस्टिंग - परामर्श

डिफ़ॉल्ट चयन

कोई डिफ़ॉल्ट नहीं (अनुशंसित)

[एक विकल्प चुनें... ▼]

उपयोगकर्ता को सक्रिय रूप से चयन करना होगा। अनिवार्य फ़ील्ड के लिए सबसे उपयुक्त।

पूर्व-चयनित डिफ़ॉल्ट

[संयुक्त राज्य अमेरिका ▼] ← पूर्व-चयनित

उपयोग करें जब:

• एक विकल्प अत्यंत सामान्य है
• फॉर्म भरने की प्रक्रिया को गति देता है
• तार्किक डिफ़ॉल्ट मौजूद है

डिफ़ॉल्ट सेटिंग

1. विकल्पों की सूची में, डिफ़ॉल्ट विकल्प को चिह्नित करें।
2. या सेटिंग्स में “डिफ़ॉल्ट मान” सेट करें

ड्रॉपडाउन बनाम रेडियो बटन

ड्रॉपडाउन का उपयोग तब करें जब

• 6+ विकल्प
• लंबी सूची (देश, राज्य)
• स्थान सीमित है
• विकल्प प्रकृति में समान हैं

रेडियो बटन का उपयोग तब करें जब

• 2-5 विकल्प
• सभी विकल्प दिखाई देने चाहिए
• विकल्पों के विवरण दिए गए हैं।
• दृश्य तुलना महत्वपूर्ण है

साथ-साथ तुलना

ड्रॉपडाउन (6+ विकल्प, क्लिक करने तक छिपे रहेंगे): [एक प्लान चुनें... ▼] रेडियो बटन (2-5 विकल्प, सभी दिखाई देंगे): ○ मुफ़्त ○ बेसिक ($9/माह) ○ प्रो ($29/माह) ○ एंटरप्राइज़ (हमसे संपर्क करें)

स्टाइलिंग ड्रॉपडाउन

डिफ़ॉल्ट स्वरूप

ड्रॉपडाउन फॉर्म स्टाइलिंग को इनहेरिट करते हैं:

• बॉर्डर का रंग/त्रिज्या
• पृष्ठभूमि का रंग
• फ़ॉन्ट परिवार/आकार
• गद्दी

कस्टम स्टाइलिंग विकल्प

• ड्रॉपडाउन तीर आइकन
• चयनित वस्तु की उपस्थिति
• विकल्प होवर अवस्थाएँ
• मल्टी-सेलेक्ट टैग स्टाइलिंग

मोबाइल स्टाइलिंग

नेटिव मोबाइल ड्रॉपडाउन:

• iOS: व्हील पिकर
• एंड्रॉइड: सामग्री चयनकर्ता
• ऑपरेटिंग सिस्टम के अनुरूप

सर्वोत्तम प्रथाएं

1. विकल्पों को तार्किक रूप से क्रमबद्ध करें

• वर्णानुक्रम: देशों, नामों
• संख्यात्मक: मात्राएँ, श्रेणियाँ
• आवृत्ति: सबसे आम पहला
• कालानुक्रमिक: समय स्लॉट, तारीखें

2. विकल्पों को संक्षिप्त रखें

अच्छा: "संयुक्त राज्य अमेरिका" से बचें: "संयुक्त राज्य अमेरिका (यूएसए)" अच्छा: "$1,000 - $5,000" से बचें: "एक हजार और पांच हजार डॉलर के बीच"

3. आवश्यकतानुसार "अन्य" शब्द का प्रयोग करें

विकल्प: - गूगल - फेसबुक - लिंक्डइन - मित्र द्वारा रेफरल - अन्य ← विशेष मामलों को भी शामिल करता है

4. पहले विकल्प के बजाय प्लेसहोल्डर का उपयोग करें।

अच्छा: प्लेसहोल्डर: "चुनें..." विकल्प: विकल्प 1, विकल्प 2, विकल्प 3 बचें: विकल्प: "चुनें...", विकल्प 1, विकल्प 2 (पहला विकल्प प्रॉम्प्ट नहीं होना चाहिए)

5. लंबी सूचियों के लिए खोज सक्षम करें

15-20 से अधिक विकल्पों वाले किसी भी ड्रॉपडाउन को खोजने योग्य होना चाहिए।

6. लोडिंग प्रदर्शन पर विचार करें

बहुत लंबी सूचियों (1000+) के लिए निम्नलिखित की आवश्यकता हो सकती है:

• धीरे लोड हो रहा है
• सर्वर-साइड खोज
• उपश्रेणियों में विभाजित करना

ड्रॉपडाउन के सामान्य उपयोग के उदाहरण

संपर्क प्रपत्र

- विभाग (बिक्री, सहायता, बिलिंग) - पूछताछ का प्रकार (प्रश्न, प्रतिक्रिया, शिकायत) - आपको हमारे बारे में कैसे पता चला

पंजीकरण फार्म

- देश - राज्य/प्रांत - उद्योग - कंपनी का आकार - पद/भूमिका

आर्डर फ़ॉर्म

- उत्पाद चयन - मात्रा - आकार/रंग विकल्प - शिपिंग विधि

सर्वेक्षण प्रपत्र

- रेटिंग स्केल (1-10) - आवृत्ति (कभी नहीं से हमेशा तक) - सहमति (पूरी तरह असहमत से पूरी तरह सहमत तक)

बुकिंग फॉर्म

- सेवा का प्रकार - पसंदीदा तिथि - समय अवधि

समस्या निवारण

ड्रॉपडाउन में विकल्प नहीं दिख रहे हैं

• विकल्पों की सुरक्षा सुनिश्चित करें
• विकल्प सूची खाली है या नहीं, इसकी जाँच करें
• कैश साफ़ करें और रीफ़्रेश करें

खोज काम नहीं कर रही

• खोज सुविधा सक्षम है, इसकी पुष्टि करें
• जावास्क्रिप्ट त्रुटियों की जाँच करें
• अलग-अलग ब्राउज़र में परीक्षण करें

मल्टी-सेलेक्ट में सभी चयन सेव नहीं हो रहे हैं

• मल्टी-सेलेक्ट सक्षम है या नहीं, इसकी पुष्टि करें।
• फॉर्म सबमिशन हैंडलिंग की जांच करें
• कम विकल्पों के साथ परीक्षण करें

मोबाइल पिकर दिखाई नहीं दे रहा है

• कस्टम स्टाइलिंग नेटिव स्टाइलिंग को ओवरराइड कर सकती है।
• वास्तविक मोबाइल डिवाइस पर परीक्षण करें
• जावास्क्रिप्ट विरोधों की जाँच करें

आसान इस्‍तेमाल

कीबोर्ड नेविगेशन

• ड्रॉपडाउन पर फोकस करने के लिए टैब दबाएं
• दिशा बदलने के लिए तीर कुंजियों का उपयोग करें
• चयन करने के लिए एंटर/स्पेस दबाएँ
• जंप करने के लिए पहला अक्षर टाइप करें

स्क्रीन रीडर

• लेबल सही ढंग से जुड़ा हुआ है
• विकल्पों की घोषणा की गई
• चयन की पुष्टि हो गई है

सर्वोत्तम प्रथाएं

• स्पष्ट, वर्णनात्मक लेबल
• तार्किक विकल्प क्रम
• प्लेसहोल्डर को केवल निर्देश के रूप में उपयोग करने से बचें

सारांश

ड्रॉपडाउन मेनू बनाना:

1. ड्रॉपडाउन फ़ील्ड जोड़ें – आकार बनाने के लिए खींचें
2. लेबल सेट करें – स्पष्ट प्रश्न/निर्देश
3. प्लेसहोल्डर जोड़ें – “चयन करें…” पाठ
4. विकल्प दर्ज करें - प्रति पंक्ति एक
5. खोज योग्य सक्षम करें – लंबी सूचियों के लिए
6. मल्टी-सेलेक्ट सक्षम करें – यदि एकाधिक विकल्पों की आवश्यकता हो
7. आवश्यक सेट करें – प्रपत्र की आवश्यकताओं के आधार पर
8. अच्छी तरह से परीक्षण करें – सभी विकल्प, सभी उपकरण

निष्कर्ष

फॉर्म में विकल्पों के चयन को ड्रॉपडाउन कुशलतापूर्वक संभालते हैं। ये जगह बचाते हैं, डेटा को मानकीकृत करते हैं और सभी उपकरणों पर अच्छी तरह से काम करते हैं। छोटी सूचियों के लिए, रेडियो बटन का उपयोग करें। लंबी सूचियों के लिए, खोज सक्षम करें। एकाधिक चयन के लिए, बहु-चयन मोड का उपयोग करें। सही कॉन्फ़िगरेशन ड्रॉपडाउन को शक्तिशाली इनपुट फ़ील्ड बनाता है जो उपयोगकर्ता अनुभव और डेटा गुणवत्ता दोनों को बेहतर बनाते हैं।

ऑटो फॉर्म बिल्डर इसमें सर्च मोड, मल्टी-सेलेक्ट ऑप्शन और कस्टम स्टाइलिंग के साथ पूरी तरह से सुसज्जित ड्रॉपडाउन फ़ील्ड शामिल हैं। मिनटों में प्रोफेशनल सेलेक्ट मेनू बनाएं।

ड्रॉपडाउन जोड़ने के लिए तैयार हैं? ऑटो फॉर्म बिल्डर डाउनलोड करें और आज ही ड्रॉपडाउन मेनू वाले फॉर्म बनाना शुरू करें।