मान लीजिए किसी School में कक्षा तक पहुँचने का रास्ता ही नहीं लिखा—विद्यार्थी भटकेंगे। Website का Navigation Menu भी उसी रास्ते का नक्शा है। Home, About, Course और Contact जैसे Links से पाठक सही जगह पहुँचते हैं।
WordPress में Menu बनाने का तरीका आपके Theme के प्रकार पर निर्भर करेगा। इस पाठ में Block Theme के Navigation Block और Classic Theme के Menus दोनों को आसान हिंदी में समझेंगे। DealYou.in के Live Header/Footer को बिना अनुमति नहीं बदलेंगे।
इस पाठ में आप क्या सीखेंगे?
- अच्छे Header Menu की संरचना तय करना
- Block Theme में Navigation Block की भूमिका समझना
- Classic Theme में Appearance → Menus का रास्ता पहचानना
- Submenu, Category और Custom Links जोड़ने का अभ्यास
- Mobile Menu/Overlay और Footer Navigation का परीक्षण
- Broken और भ्रामक Links से बचना
1. Menu क्या है और इसकी जरूरत क्यों है?
Navigation Menu Website के मुख्य Sections तक जाने का सरल रास्ता है। पाठक को हर बार Search का सहारा न लेना पड़े, इसलिए Menu में कम और स्पष्ट नाम रखें। उदाहरण: Home | Course | Blog | About | Contact।
Header Menu और Footer Menu की जिम्मेदारी अलग हो सकती है। Header में मुख्य काम दिखाएँ; Footer में Privacy Policy, Contact और Disclosure जैसे दस्तावेजों तक पहुँच दें। बहुत सारे Items जोड़ने से खासकर Mobile पर Menu भारी लग सकता है।
2. Block या Classic Theme? पहले रास्ता पहचानें
यदि Active Theme Block Theme है तो आम तौर पर Appearance → Editor में Navigation को Site Editor से Manage करते हैं। Classic Theme में Appearance → Menus या Appearance → Customize का रास्ता मिलता है।
कुछ Classic Themes अपने Header Builder के अंदर Menu Location देती हैं। इसलिए हर WordPress Website पर एक ही Screen मिलने का दावा गलत है। पहले Theme पहचानें, फिर उसी का सही Workflow अपनाएँ।
3. Block Theme में Navigation Block
Block Theme की Test Website में Appearance → Editor खोलें और Header के अंदर Navigation Block पहचानें। यह Menu Items और उनके Layout को Manage करता है। यदि Menu पहले से है, तो उसे चुनने या Edit करने के विकल्प दिख सकते हैं।
कुछ Installations में Navigation Block शुरू में Page List दिखाता है। यह Published Pages को अपने आप दिखा सकता है। Individual Items Control करने के लिए इसे जरूरत के अनुसार Editable Links में बदलना होता है; वास्तविक Buttons WordPress Version के हिसाब से बदल सकते हैं।
4. Navigation में नया Page Link कैसे जोड़ें?
Test Site में Navigation Block चुनें, Add (+) से उपलब्ध Published Page खोजें और सही Link जोड़ें। जिस Page का Link डाल रहे हैं, उसका URL तथा Label दोनों जाँचें। Home Label को किसी बाहरी Shop URL से न जोड़ें—यह पाठक को भ्रमित करेगा।
अगर Destination Page अभी Draft है, उसे Public Menu में Live Link की तरह न डालें। WordPress के कुछ Editors Page बनाने का विकल्प भी देते हैं; पहले Publishing Status देखें, वरना अधूरा Page पाठकों को दिख सकता है।
5. Menu Items को सही क्रम में रखें
अच्छा क्रम आसान होता है: पहले Home, फिर मुख्य Course/Services, उसके बाद Blog, About और Contact। WordPress में List View या Move Up/Move Down से Items का क्रम बदला जा सकता है।
Menu Labels छोटे और स्पष्ट रखें: “WordPress Course” समझ आता है, जबकि “हमारी असीम ज्ञान यात्रा” जैसी अस्पष्ट Label से Navigation कठिन हो सकती है। Item का Text और Linked Destination अलग चीजें हैं; दोनों जाँचें।
6. Submenu/Dropdown कब बनाना चाहिए?
जब किसी मुख्य विषय के नीचे 2–4 संबंधित Sections हों, तब Submenu उपयोगी हो सकता है। उदाहरण: Course → Basics, Design, SEO। Submenu बच्चों की कक्षा की तरह Parent Topic के नीचे रहता है।
बहुत गहरे Submenus (तीन-चार स्तर) मोबाइल पर उपयोग करना कठिन होते हैं। Hover पर निर्भर Menu Touch Screen पर कमजोर साबित हो सकता है। Menu Keyboard और Tap दोनों से खुलना चाहिए।
7. Mobile Navigation और Overlay
छोटी स्क्रीन पर Header का लंबा Menu अक्सर एक Menu Icon में बदलता है। Navigation Block में Overlay Visibility जैसे विकल्प मिल सकते हैं—Off, Mobile या Always—जो Theme/Version पर निर्भर हैं।
Mobile Preview में केवल Icon का दिखना काफी नहीं है। उसे Tap करके Menu खुलता है या नहीं, Close Button काम करता है या नहीं, Dropdown Click से खुलता है या नहीं, और Text Screen से बाहर तो नहीं जाता—ये सब जाँचें।
8. Classic Theme: Appearance → Menus
यदि Active Theme Classic/Hybrid Menus Screen देता है, तो Appearance → Menus खोलें। यहाँ नया Menu बना सकते हैं, Pages/Categories/Custom Links जोड़ सकते हैं और उन्हें ऊपर-नीचे कर सकते हैं।
Menu बनाना और उसे Header पर दिखाना अलग कदम हो सकते हैं। Menu Location (जैसे Primary या Footer) चुनना जरूरी हो सकता है। Theme-specific Header Builder के कारण स्क्रीन का नाम और रास्ता बदल सकता है।
9. Custom Link क्या होता है?
किसी Course Hub, Category Archive या दूसरे विश्वसनीय Destination को Menu में डालने के लिए Custom Link उपयोगी है। URL में सही https://, Domain और Path जाँचें।
गलत URL, Under-Construction Page या खाली Category को Menu में डालने से User Experience खराब होता है। अगर बाहरी Website का Link देना जरूरी हो तो उसकी पहचान स्पष्ट रखें; पाठक को चुपचाप बाहरी Site पर न भेजें।
10. Footer Menu बनाना
Footer मुख्य Content खत्म होने के बाद जरूरी भरोसेमंद Links दिखाता है। उदाहरण: About, Contact, Privacy Policy, Disclaimer और Affiliate Disclosure। इन Pages के नाम अलग हो सकते हैं, लेकिन Links वास्तविक Published Pages पर जाने चाहिए।
किसी कानून का Placeholder Text केवल दिखाने के लिए मत जोड़ें। आपकी Website की Privacy और Affiliate Policy वास्तविक काम के अनुरूप होनी चाहिए। इसकी विस्तृत चर्चा Course Lesson 27 में होगी।
11. Category और Course Hub को Menu में रखें?
अगर WordPress Course के 30 Lessons हैं तो Header में 30 अलग Links रखने की जगह एक WordPress Course Hub बेहतर हो सकता है। Hub पर Modules और सभी Lessons व्यवस्थित दिखाए जा सकते हैं।
Category Links भी उपयोगी हैं, लेकिन Empty Categories न जोड़ें। Menu कम रखें, बाकी Links Article के Previous/Next Navigation या Hub में दें। इससे पाठक को ज्यादा विकल्प एक साथ नहीं दिखेंगे।
12. Google और Crawlable Links
Google को सामान्य <a href="..."> HTML Links समझने में आसानी होती है। Menu में असली Destination URL होना चाहिए; केवल JavaScript Click वाले या बिना URL के नकली Buttons पर निर्भर न रहें।
सही Internal Linking SEO की गारंटी नहीं, लेकिन पाठक और Crawlers दोनों के लिए Site Structure समझने में मदद करती है। Page Title, Anchor Text और Navigation Label एक दूसरे के अनुरूप रखें।
13. Practical Exercise: Demo Menu Plan
Step 1: कागज पर Header के पाँच Labels लिखें: Home, Course, Blog, About, Contact। Step 2: हर Label के सामने उसका वास्तविक URL या “अभी Draft” लिखें। Step 3: Course के नीचे Basics और Design नाम के दो Submenus Sketch करें।
Step 4: Footer में Privacy Policy और Disclaimer Links की जगह तय करें। Step 5: 320px Phone Screen पर कल्पना करें कि एक Icon से Menu कैसे खुलेगा। Actual Test केवल सुरक्षित Test Website पर करें।
14. शुरुआती पाँच गलतियाँ
Menu में 20–30 Links ठूँस देना; खाली Category को जोड़ना; गलत Link/Label लगाना; Mobile Overlay न जाँचना; और Menu Location Assign न करना—ये आम गलतियाँ हैं।
Publish से पहले हर Menu Item को Tap करके Destination, Back Button, Dropdown और Keyboard Focus जाँचें। Header और Footer के Links को अलग-अलग Checklist में रखें।
15. Quick Revision
Block Theme में Navigation Block; Classic Theme में अक्सर Appearance → Menus या Customizer; Submenu = Parent के नीचे Links; Mobile Overlay = छोटी स्क्रीन पर खुलने वाला Menu।
सही Menu की पहचान है: कम विकल्प, स्पष्ट नाम, सही Links और मोबाइल पर आसान उपयोग। यह केवल Decoration नहीं बल्कि Website का रास्ता है।
अक्सर पूछे जाने वाले सवाल (FAQs)
Appearance में Menus क्यों नहीं दिखता?
Block Theme में Menus Screen की जगह Site Editor के Navigation Block से Menu Manage होता है। Classic/Hybrid Themes में अलग Menus Screen हो सकती है।
Header Menu और Footer Menu अलग रख सकते हैं?
हाँ, Theme और Navigation Setup के अनुसार अलग Menus/Navigation Blocks बनाए जा सकते हैं।
WordPress Menu में External Link कैसे जोड़ते हैं?
Navigation Block या Appearance → Menus में Custom Link विकल्प से। पहले सही URL और Destination की जाँच करें।
Mobile Menu खुलता क्यों नहीं?
Theme, Overlay Setting, JavaScript Error या CSS की वजह से हो सकता है। Browser Console और Responsive Test से कारण खोजें।
क्या सारे 30 Course Lessons Header Menu में डाल दें?
नहीं। एक Course Hub और Modules का साफ Structure बेहतर रहता है; Previous/Next Links से Navigation आसान बनाइए।
निष्कर्ष और अगला पाठ
इस पाठ में आपने Navigation Menu को आसान उदाहरणों में समझा। अब अगले पाठ में इसी जानकारी को आगे बढ़ाएँगे। अपने Live WordPress की महत्वपूर्ण Settings बदलने से पहले हमेशा Backup और जाँच करें।
पिछला पाठ: पाठ 14 — Site Editor और Customizer
अगला पाठ: पाठ 16 — Pages और Posts में फर्क
संबंधित पढ़ें: पाठ 5 — WordPress क्या है?
Official Sources और आगे की पढ़ाई
- Navigation Block — WordPress.org — Official Documentation
- Appearance Menus Screen — WordPress.org — Official Documentation
- Site Editor — WordPress.org — Official Documentation
- Google Crawlable Links — Official Documentation
नोट: Interface WordPress Version, Theme, Plugins और User Permissions के अनुसार अलग हो सकता है। चित्र शिक्षण के लिए बनाए गए हैं, वास्तविक WordPress Screenshots नहीं।