खोजें
प्रत्येक आगंतुक एक संभावित ग्राहक है जो कुछ खोज रहा है एक कमजोर, छिपी, या बदसूरत खोज बार उस यात्रा को तोड़ता है मास्टर एडॉन्स सर्च एलिमेंट आपको खोज को एकीकृत करने के दो शक्तिशाली तरीके देता है: एक क्लासिक इनलाइन फॉर्म या क्लिक-टू-ओपन आइकन पॉपअप इसे कहीं भी रखें अपने हेडर, साइडबार, हीरो सेक्शन को ठीक करें और फिर हर पिक्सेल को स्टाइल करें फॉर्म, बटन, आइकन और यहां तक कि पॉपअप के संदेश।
खोज फ़ॉर्म और आइकन पॉपअप
हर डिजाइन में पूर्ण खोज बार के लिए जगह नहीं है यही कारण है कि हम आपको दो अलग-अलग प्रकार देते हैं पारंपरिक, हमेशा दिखाई देने वाले इनपुट फ़ील्ड और बटन के लिए “फॉर्मेग्माग्ज चुनें साइडबार के लिए या नायक के नीचे बिल्कुल सही या, एक चिकना, अंतरिक्ष-बचत आवर्धक ग्लास के लिए “Icon” का चयन करें, जब क्लिक किया जाता है, तो एक सुरुचिपूर्ण पॉपअप खोज ओवरले खुलता है यह आपके डिज़ाइन को तब तक साफ रखता है जब तक उपयोगकर्ता को इसकी आवश्यकता नहीं होती है आप फॉर्म के लिए बटन टेक्स्ट और पॉपअप ट्रिगर के लिए सटीक आइकन को नियंत्रित करते हैं।
- फॉर्म प्रकार: अनुकूलन योग्य सबमिट बटन (टेक्स्ट या आइकन के रूप में) के साथ एक मानक, हमेशा दिखाई देने वाला खोज फॉर्म।
- आइकन/पॉपअप प्रकार: एक स्टाइलिश आइकन बटन जो पूर्ण पॉपअप खोज फ़ॉर्म को ट्रिगर करता है, जिससे महत्वपूर्ण हेडर स्थान की बचत होती है।
- आइकन लाइब्रेरी: अपनी साइट की शैली से मेल खाने के लिए विशाल आइकन लाइब्रेरी से कोई आवर्धक ग्लास आइकन चुनें।
पूर्ण प्रपत्र एवं इनपुट फ़ील्ड स्टाइलिंग
खोज फ़ॉर्म को अपने लेआउट का एक प्राकृतिक हिस्सा बनाएं पूरे फॉर्म कंटेनर को डिज़ाइन करें: इसकी पृष्ठभूमि, चौड़ाई, मार्जिन, पैडिंग सेट करें, और इसे बॉर्डर त्रिज्या और बॉक्स छाया दें फिर, इनपुट फ़ील्ड को स्वयं स्टाइल करें इसकी टाइपोग्राफी, रंग, पृष्ठभूमि, सीमा और आंतरिक पैडिंग को नियंत्रित करें आप फोकस स्टेट (जब कोई उपयोगकर्ता क्लिक करता है) को एक अलग सीमा रंग के साथ भी डिज़ाइन कर सकते हैं यह सुनिश्चित करता है कि आपका खोज बार प्रीमियम दिखता है और महसूस करता है, ब्राउज़र डिफ़ॉल्ट की तरह नहीं।
- कंटेनर डिजाइन: पृष्ठभूमि, पैडिंग, सीमाओं और छाया के साथ फॉर्म के बॉक्स को स्टाइल करें।
- इनपुट फ़ील्ड नियंत्रण: टेक्स्ट बॉक्स का रंग, टाइपोग्राफी, चौड़ाई और बॉर्डर त्रिज्या अनुकूलित करें।
- उन्नत राज्य: सक्रिय क्षेत्र पर प्रकाश डालते हुए, केंद्रित राज्य के लिए एक अद्वितीय सीमा रंग को परिभाषित करें।
आइकन डिज़ाइन और पॉपअप मैसेजिंग
आइकन/पॉपअप प्रकार के लिए, आइकन स्वयं एक बटन है इसे पूर्णता के लिए स्टाइल करें इसके आकार, रंग और इसके चारों ओर पैडिंग और मार्जिन को समायोजित करें फिर, पॉपअप को डिज़ाइन करें जो दिखाई देता है इनपुट टेक्स्ट प्लेसहोल्डर को अनुकूलित करें (जैसे “टाइपिंग शुरू करें...”) और, महत्वपूर्ण रूप से, एक सहायक विवरण जोड़ें (जैसे, “Hit खोज में प्रवेश करें या ESC बंद करने के लिए) यह पाठ उपयोगकर्ताओं का मार्गदर्शन करता है, प्रयोज्यता में सुधार करता है और एक पॉलिश, पेशेवर इंटरैक्टिव अनुभव बनाता है।
- आइकन स्टाइलिंग: आइकन का रंग और आकार बदलें, और आइकन मार्जिन और पैडिंग के साथ इसके आसपास के स्थान को समायोजित करें।
- स्मार्ट पॉपअप टेक्स्ट: पॉपअप के खोज फ़ील्ड के अंदर उपयोगकर्ता के अनुकूल प्लेसहोल्डर टेक्स्ट सेट करें।
- पॉपअप निर्देश: पॉपअप का उपयोग कैसे करें (खोजें/बंद करें) यह समझाने के लिए इनपुट के नीचे एक विवरण पंक्ति जोड़ें।
खोज के लिए अक्सर पूछे जाने वाले प्रश्न
क्या यह खोज मेरे विषय के डिफ़ॉल्ट खोज परिणाम पृष्ठ के साथ काम करती है?
हां, यह होना चाहिए यह तत्व फ्रंट-एंड खोज फ़ॉर्म प्रदान करता है जब कोई उपयोगकर्ता क्वेरी सबमिट करता है, तो यह आपके वर्डप्रेस (या वूकॉमर्स) डिफ़ॉल्ट खोज कार्यक्षमता का उपयोग करेगा और आपके थीम के खोज डॉट पीएचपी टेम्पलेट पृष्ठ पर परिणाम दिखाएगा यह खोज तर्क को प्रतिस्थापित नहीं करता है, बस इनपुट फॉर्म अद्भुत दिखता है।
क्या मैं साइडबार में फॉर्म खोज और हेडर में आइकन खोज दोनों प्राप्त कर सकता हूं?
बिल्कुल आप एक ही पृष्ठ या साइट पर कई खोज तत्वों का उपयोग कर सकते हैं प्रत्येक को स्वतंत्र रूप से कॉन्फ़िगर और स्टाइल किया गया है इसलिए आप अपने ब्लॉग साइडबार में एक बड़ा रूप और अपने हेडर में एक न्यूनतम आइकन रख सकते हैं, प्रत्येक अपनी सेटिंग्स के साथ।
क्या खोज पॉपअप मोबाइल-अनुकूल है?
हाँ पॉपअप उत्तरदायी होने के लिए डिज़ाइन किया गया है यह आम तौर पर एक केंद्रित ओवरले के रूप में खुलेगा जो अधिकांश मोबाइल स्क्रीन को कवर करता है, इनपुट फ़ील्ड और विवरण स्पष्ट रूप से पठनीय है आइकन ट्रिगर भी स्पर्श उपकरणों के लिए उचित रूप से स्केल करता है।
क्या मैं आवर्धक ग्लास आइकन को किसी और चीज़ में बदल सकता हूँ, जैसे उद्धरण के लिए "क्यू"?
आप एकीकृत आइकन लाइब्रेरी से कोई भी आइकन चुन सकते हैं (जैसे फॉन्टऑसम) जबकि एक आवर्धक ग्लास मानक है, आप तकनीकी रूप से एक अलग आइकन का उपयोग कर सकते हैं हालांकि, सार्वभौमिक उपयोगकर्ता समझ के लिए, हम दृढ़ता से एक मान्यता प्राप्त खोज प्रतीक (आवर्धक ग्लास) के साथ चिपके रहने की सलाह देते हैं।
ट्रेंडिंग एलिमेंटर विजेट और एक्सटेंशन
कम समय में परिष्कृत वेबसाइट बनाएं।
ग्लासमोर्फिज्म
कंटेनर अतिरिक्त
पैटर्न
पोस्ट/पेज डुप्लीकेटर
