जानें कि अपनी वर्डप्रेस वेबसाइट के मुख्य नेविगेशन के लिए एक स्टिकी मेनू कैसे बनाएं! स्टिकी मेनू आपकी वेबसाइट के मेनू को साइट आगंतुकों के लिए अधिक आसानी से उपलब्ध कराकर उपयोगकर्ता अनुभव को बेहतर बनाने में मदद करते हैं। साथ ही, यह आपकी साइट के समग्र स्वरूप को बेहतर बनाने में मदद कर सकता है। आइए इसमें शामिल हों!

विषय - सूची

1. साइट संपादक पर जाएँ

इस प्रक्रिया में पहला कदम वर्डप्रेस व्यवस्थापक क्षेत्र के भीतर "साइट संपादक" पर नेविगेट करना है। साइट एडिटर वर्डप्रेस में "ब्लॉक थीम्स" के लिए उपलब्ध है, यह मानते हुए कि आप वर्डप्रेस संस्करण 5.9 या नए का उपयोग कर रहे हैं।

साइट संपादक पर नेविगेट करने के लिए, पर जाएँ सूरत> संपादक (उपरोक्त छवि में लाल तीर) WP व्यवस्थापक क्षेत्र में मुख्य नेविगेशन से।

स्क्रीन के दाईं ओर मुख्य सामग्री क्षेत्र पर क्लिक करें (हल्के नीले रंग में उल्लिखित और उपरोक्त छवि में नीले तीर द्वारा दर्शाया गया है)। यह आपको साइट एडिटर के अंदर ब्लॉक एडिटर पर ले जाएगा।

दाईं ओर, टैब "पेज" के नीचे, आपको "टेम्पलेट" लेबल वाली एक पंक्ति दिखाई देगी (उपरोक्त छवि में नीले रंग में उल्लिखित)। टेम्प्लेट नाम/लिंक (लाल तीर) पर क्लिक करें। फिर, "टेम्पलेट संपादित करें" पर क्लिक करें (हरा तीर - कभी-कभी "टेम्पलेट संपादित करें" ड्रॉपडाउन के नीचे एक छोटा नीला टेक्स्ट लिंक होता है जो आपके टेम्पलेट का नाम प्रदर्शित करता है)।

2. अपना टेम्पलेट संपादित करें

अब आप अपनी वेबसाइट के मुखपृष्ठ के लिए टेम्पलेट संपादक के अंदर होंगे। (यदि आपके पास अपनी साइट के लिए होमपेज सेट नहीं है, तो आप देख सकते हैं यह ट्यूटोरियल आपकी वर्डप्रेस वेबसाइट के लिए एक स्थिर होमपेज सेट करने पर है).

टेम्प्लेट के शीर्ष पर आपके पेज के लिए आपका मुख्य नेविगेशन है - जिसे आपके वेबपेज का "हेडर" भी कहा जाता है। जब आप इस तत्व पर अपना माउस घुमाते हैं, तो आपको इसे रेखांकित करते हुए एक बैंगनी बॉक्स दिखाई देगा (उपरोक्त छवि में लाल तीर)। इससे पता चलता है कि यह तत्व एक है "समन्वयित पैटर्न," जिसका मतलब है कि पैटर्न के एक उदाहरण में बदलाव करने से साइट के सभी उदाहरणों में बदलाव लागू हो जाएंगे। हेडर सिंक्ड पैटर्न का चयन करने के लिए इस क्षेत्र पर क्लिक करें।

यदि यह आपकी साइट का मुख्य हेडर तत्व है, तो अब आपको देखना चाहिए कि सिंक किए गए पैटर्न को ब्लॉक टूलबार में "हेडर" लेबल किया गया है।

3. अपने हेडर को किसी ग्रुप में जोड़ें

चयनित हेडर पैटर्न के लिए ब्लॉक टूलबार के भीतर, "विकल्प" आइकन (उपरोक्त छवि में लाल तीर) पर क्लिक करें और "समूह" (हरा तीर) चुनें। यह सिंक किए गए पैटर्न को एक ग्रुप ब्लॉक में नेस्ट कर देगा।

आप देखेंगे कि ब्लॉक टूलबार में अब ग्रुप ब्लॉक आइकन (उपरोक्त छवि में नीला तीर) है, और मुख्य नेविगेशन क्षेत्र के चारों ओर की रूपरेखा अब बैंगनी (लाल तीर) के बजाय नीली है।

ध्यान दें कि इससे आपके मुख्य नेविगेशन मेनू की चौड़ाई बदल सकती है। चौड़ाई समायोजित करने के लिए, अपने माउस को हेडर सिंक किए गए पैटर्न पर घुमाएं और इसे (लाल तीर) चुनने के लिए क्लिक करें।

हेडर सिंक किए गए पैटर्न के लिए ब्लॉक टूलबार में, "संरेखित करें" आइकन (हरा तीर) पर क्लिक करें और इसे वापस वांछित चौड़ाई (नीला तीर - मेरे मामले में मैंने "वाइड चौड़ाई" चुना) में बदलें।

ग्रुप ब्लॉक पर वापस लौटने के लिए, हेडर ब्लॉक टूलबार (गुलाबी तीर) में "ग्रुप चुनें" आइकन पर क्लिक करें।

वर्डप्रेस सरलीकृत: शक्तिशाली वेबसाइट कैसे बनाएं डेविस मीडिया डिज़ाइन द्वारा पाठ्यक्रम

4. समूह को "चिपचिपा" पर सेट करें

चयनित समूह के साथ, स्क्रीन के दाईं ओर सेटिंग्स साइडबार के अंतर्गत "ब्लॉक" टैब पर जाएँ (उपरोक्त छवि में लाल तीर)।

"स्थिति" (हरा तीर) लेबल वाले मेनू आइटम पर क्लिक करें। अब आपको यहां "डिफ़ॉल्ट" (गुलाबी तीर) लेबल वाला एक ड्रॉपडाउन दिखाई देगा। ड्रॉपडाउन पर क्लिक करें और "स्टिकी" विकल्प (नीला तीर) चुनें।

संपादक के शीर्ष पर जाएँ और "सहेजें" बटन (लाल तीर) पर क्लिक करें, फिर "सहेजें" पर दोबारा क्लिक करें। अब आपके पास अपनी वर्डप्रेस वेबसाइट के लिए एक स्टिक मेनू मुख्य नेविगेशन होगा!

5. स्टिकी मेनू को स्टाइल करें

आप नए स्टिकी मेनू के कई तत्वों को कस्टमाइज़/स्टाइल कर सकते हैं, लेकिन इस ट्यूटोरियल के लिए मैं केवल समूह ब्लॉक के पीछे एक पृष्ठभूमि जोड़ूंगा ताकि यह सुनिश्चित हो सके कि मेनू वेबपेज की पूरी चौड़ाई में फैला हुआ है।

ऐसा करने के लिए, चयनित समूह ब्लॉक के साथ, मैं सेटिंग्स साइडबार (उपरोक्त छवि में लाल तीर) के "शैलियाँ" टैब पर नेविगेट करूंगा।

"रंग" के अंतर्गत, मैं "पृष्ठभूमि" विकल्प (नीला तीर) पर क्लिक करूंगा, फिर पृष्ठभूमि रंग को सफेद (हरा तीर) पर सेट करने के लिए सफेद नमूने का चयन करूंगा।

एक बार फिर मैं परिवर्तनों को सहेजने के लिए "सहेजें" पर दो बार क्लिक करूंगा।

ध्यान दें कि आप "पैडिंग" और "मार्जिन" स्लाइडर्स का उपयोग करके "आयाम" अनुभाग के अंतर्गत अपनी वेबसाइट के हेडर की चौड़ाई, ऊंचाई या रिक्ति को हमेशा समायोजित कर सकते हैं।

आप डिवाइस आइकन (लाल तीर) पर क्लिक करके अपनी साइट का पूर्वावलोकन कर सकते हैं, फिर "साइट देखें" (हरा तीर) पर क्लिक करें।

आप अपनी वेबसाइट को स्क्रॉल कर सकते हैं और चिपचिपा नेविगेशन मेनू को शीर्ष (हरा तीर) पर यथावत बने हुए देख सकते हैं!

एक बार जब आप अपने स्टिकी मेनू का संपादन पूरा कर लें, तो संपादक के शीर्ष पर स्थित "बैक" बटन (लाल तीर) पर क्लिक करें। यह आपको साइड एडिटर के अंदर आपके वेबपेज पर लौटा देगा।

WP एडमिन क्षेत्र पर लौटने के लिए, बस ऊपरी बाएँ कोने में लोगो पर क्लिक करें।

इस ट्यूटोरियल के लिए बस इतना ही! यदि आपने इसका आनंद लिया, तो आप ले सकते हैं Udemy पर मेरे गहन पाठ्यक्रम के साथ वर्डप्रेस सीखें. या, आप अन्य निःशुल्क जांच कर सकते हैं वर्डप्रेस वीडियो ट्यूटोरियल और वर्डप्रेस सहायता लेख मेरी वेबसाइट पर.

डेविस मीडिया डिज़ाइन फ्री क्रिएटिव ऐप्स ईमेल न्यूज़लेटर

DMD न्यूज़लैटर की सदस्यता लें

अपने पसंदीदा निःशुल्क रचनात्मक ऐप्स पर नए ट्यूटोरियल, पाठ्यक्रम अपडेट और नवीनतम समाचार प्राप्त करने के लिए साइन अप करें!

आपने सफलतापूर्वक सदस्यता ले ली है!

Pinterest पर यह पिन