साइट संपादक का परिचय

प्रतिलेख

परिचय

आइए साइट एडिटर को explore करें, जो आपको हेडर से लेकर फुटर और इनके बीच की हर चीज़ तक, अपनी साइट की सभी चीज़ों को ब्लॉक्स का उपयोग करके डिज़ाइन करने की सुविधा देता है। आइए Appearance पर जाएँ और Editor पर क्लिक करें। इससे साइट एडिटर खुल जाएगा। बाईं ओर साइट व्यू साइडबार है, और यह उपयोगी टूल आपको अपनी साइट के प्रमुख हिस्सों, जिनमें नेविगेशन, स्टाइल, पेज, टेम्प्लेट और पैटर्न शामिल हैं, में गहराई से जाने की सुविधा देता है। इस ट्यूटोरियल का उद्देश्य इन तत्वों की गहरी समझ विकसित करना है।

नेविगेशन

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

स्टाइल

अब स्टाइल के बारे में बात करते हैं। जब आप Styles चुनते हैं, तो आप अपने थीम के साथ आने वाले विभिन्न स्टाइल संयोजनों को ब्राउज़ कर पाएँगे। जब आप Edit Styles पर क्लिक करते हैं, तो आप यहाँ से अपने स्टाइल ब्राउज़ कर सकते हैं और फिर अपनी साइट की टाइपोग्राफी, रंगों और लेआउट में बदलाव कर सकते हैं। आइए देखें कि यह कैसे काम करता है। जब आप Typography पर क्लिक करते हैं, तो आप टेक्स्ट, लिंक, हेडिंग, कैप्शन और बटन के लिए टाइपोग्राफी सेटिंग प्रबंधित कर सकते हैं। एक शानदार नई सुविधा यह है कि अब आपको फ़ॉन्ट लाइब्रेरी तक भी पहुँच मिलती है। Fonts के नीचे हमें अपने थीम में जोड़े गए फ़ॉन्ट दिखाई देंगे। लेकिन जब हम Manage Fonts पर क्लिक करते हैं, तो हम किसी भी ब्लॉक थीम के साथ अपनी पूरी साइट पर स्थानीय और Google फ़ॉन्ट इंस्टॉल, हटा और सक्रिय कर सकते हैं। जब आप Install Fonts पर क्लिक करते हैं, तो आप अपनी वेबसाइट पर कोई भी Google फ़ॉन्ट इंस्टॉल कर सकते हैं और यदि आप अपने कंप्यूटर से फ़ॉन्ट अपलोड करना चाहते हैं, तो Upload पर क्लिक कर सकते हैं। सुनिश्चित करें कि आपके द्वारा अपलोड किए जा रहे किसी भी फ़ॉन्ट का उपयोग करने का अधिकार आपके पास हो। Typography के नीचे हमें Colors दिखाई देंगे। यहाँ आप अपनी साइट के विभिन्न वैश्विक तत्वों के रंग भी बदल सकते हैं। जब हम Layout पर जाते हैं, तो हम देखेंगे कि आपको पैडिंग और ब्लॉक स्पेसिंग जैसे तत्वों पर भी नियंत्रण मिलता है।

स्टाइल बुक

यदि आप नीचे की ओर देखें, तो आप अपनी पूरी साइट के लिए विशिष्ट ब्लॉक्स के स्वरूप को कस्टमाइज़ कर सकते हैं। यह देखने के लिए कि इन्हें संपादित करने पर ये ब्लॉक कैसे बदलेंगे, अपनी साइट की Style Book पर जाएँ। आपको सबसे ऊपर एक छोटी-सी आँख दिखाई देगी। Style Book उपयोगकर्ता को अपनी साइट में डाले जा सकने वाले हर ब्लॉक का प्रीव्यू देखने की सुविधा देती है। यह आपको इस बात की झलक देती है कि वैश्विक स्टाइल किसी टेम्प्लेट में उन ब्लॉक्स को डाले बिना, प्रदर्शित किए जाने वाले किसी भी ब्लॉक को कैसे प्रभावित करेंगे। यह ध्यान रखना भी महत्वपूर्ण है कि Style Book के भीतर किसी ब्लॉक की स्टाइलिंग में बदलाव किया जा सकता है। उदाहरण के लिए, आइए Buttons ब्लॉक को अपडेट करते हैं, जिसमें बैकग्राउंड का रंग और अक्षरों का केस अपरकेस में बदलते हैं। यदि आपको यह पसंद आए, तो आप Save पर क्लिक कर सकते हैं। कृपया यह भी ध्यान दें कि अपनी Style Book में किसी व्यक्तिगत ब्लॉक में किया गया बदलाव आपके द्वारा सेट की गई वैश्विक स्टाइल पर प्राथमिकता रखता है।

स्टाइल संशोधन

जब हम यहाँ हैं, तो हमें स्टाइल संशोधनों के बारे में भी बात करनी चाहिए। आइए Style Book आइकन के आगे Style Revisions पर क्लिक करें। जब आप Style Book में किसी टेम्प्लेट को संपादित कर रहे होते हैं, तब स्टाइल संशोधन खुलते हैं। स्टाइल संशोधन सुविधा समय के साथ आपकी स्टाइल में हुए बदलावों को देखने का एक दृश्य तरीका प्रदान करती है, और यदि आपको कोई पसंदीदा स्टाइल मिलती है या आप पिछले संस्करण पर लौटना चाहते हैं, तो आप आसानी से पिछले चरण पर वापस जा सकते हैं। आपको केवल संस्करण चुनना है और फिर Apply पर क्लिक करना है। इस उदाहरण में, मैं एक टेम्प्लेट संपादित कर रहा हूँ और यही प्रक्रिया अपनाऊँगा। मैं स्टाइल संशोधन खोलूँगा, पिछली स्टाइल चुनूँगा और फिर वापस लौटने के लिए Apply पर क्लिक करूँगा। जब आप स्टाइल के आगे तीन लंबवत बिंदुओं पर क्लिक करते हैं, तो आप स्टाइल रीसेट कर सकते हैं और अतिरिक्त CSS जोड़ सकते हैं।

पेज

Styles के नीचे हम पेज बनाने और प्रकाशित करने के लिए Pages पर जा सकते हैं। नया पेज जोड़ने के लिए Pages के आगे दिए गए प्लस आइकन पर क्लिक करें और एक ड्राफ्ट बनाएँ। लेकिन आप अपने Dashboard या WP Admin में रहते हुए भी नया पेज बना सकते हैं। अब आइए अपने मौजूदा पेजों में से एक, अपने About Page को खोलते हैं। जब आप कोई पेज खोलते हैं, तो यह याद रखना महत्वपूर्ण है कि Content ब्लॉक में सामग्री जोड़नी है। दूसरे शब्दों में, Content ब्लॉक आपकी सारी सामग्री के लिए घर या कंटेनर है। दूसरी बात याद रखने योग्य यह है कि पेज संपादित करते समय आप अपने हेडर और फुटर को कस्टमाइज़ नहीं कर सकते। यह सब टेम्प्लेट प्रबंधित करने का हिस्सा है। यदि आप हेडर पर क्लिक करते हैं, तो आपको एक संदेश मिलेगा: ‘इस ब्लॉक को संपादित करने के लिए अपना टेम्प्लेट संपादित करें।’ यदि आप उस टेम्प्लेट में बदलाव करना चाहते हैं जो इस पेज को असाइन किया गया है, तो आप Edit Template पर क्लिक कर सकते हैं। इस उदाहरण में यह आपको आपके पेज टेम्प्लेट पर ले जाएगा। यहाँ आप अपने हेडर और फुटर में बदलाव कर सकते हैं। आप किसी टेम्प्लेट में सामग्री नहीं जोड़ पाएँगे। सामग्री, ज़ाहिर है, पोस्ट और पेज में जोड़ी जाती है। इस संदर्भ में Content ब्लॉक केवल एक प्लेसहोल्डर है।

टेम्प्लेट

यह हमें हमारे अगले विषय, यानी टेम्प्लेट, पर लाता है। टेम्प्लेट आपकी सामग्री के प्रदर्शित होने की संरचना प्रदान करते हैं। जब आप Templates चुनते हैं, तो आपको अपने थीम के साथ आने वाले कई टेम्प्लेट दिखाई देंगे, जो अंतर्निहित टेम्प्लेट होते हैं। उदाहरण के लिए, पेज टेम्प्लेट जो एकल पेज प्रदर्शित करता है, इंडेक्स टेम्प्लेट जो फ़ॉलबैक टेम्प्लेट होता है, या सिंगल पोस्ट टेम्प्लेट जो एकल पोस्ट का लेआउट प्रदर्शित करता है। और सबसे नीचे हमें कोई भी कस्टम टेम्प्लेट दिखाई देंगे। जब आप Templates के आगे प्लस आइकन पर क्लिक करते हैं, तो आप कई नए टेम्प्लेट जोड़ सकते हैं, यहाँ तक कि ऐसा कस्टम टेम्प्लेट भी जिसे किसी भी पोस्ट या पेज पर लागू किया जा सकता है। आइए पेज टेम्प्लेट खोलकर बेहतर ढंग से समझते हैं कि टेम्प्लेट कैसे काम करता है। टेम्प्लेट संरचना प्रदान करता है। टेम्प्लेट में आमतौर पर एक हेडर टेम्प्लेट पार्ट और एक फुटर टेम्प्लेट पार्ट शामिल होता है।

Post Content ब्लॉक टेम्प्लेट को असाइन किए गए पेज या पोस्ट से सामग्री खींचता है। इसलिए, टेम्प्लेट का उपयोग केवल पेज के लेआउट या डिज़ाइन, यानी हेडर, फुटर और यहाँ तक कि साइडबार में बदलाव करने के लिए किया जाता है। इसलिए साइट एडिटर टेम्प्लेट और पेज के संपादन के बीच स्पष्ट अंतर करता है। आप टेम्प्लेट के भीतर अपने हेडर और फुटर में बदलाव कर सकते हैं। आपके पास मौजूद विकल्पों में से एक है तीन लंबवत बिंदुओं पर क्लिक करना और Replace Header चुनना। इसके बाद आप अपने वर्तमान हेडर को अपनी मौजूदा हेडर टेम्प्लेट पार्ट्स में से किसी एक या अपने थीम के साथ आने वाले हेडर पैटर्न से बदल सकते हैं। आपके पास एक अन्य विकल्प यह है कि आप अपना हेडर चुनें और फिर Edit पर क्लिक करें। इससे आप बिना किसी अन्य व्यवधान के टेम्प्लेट संपादन मोड में अपने हेडर या फुटर में बदलाव कर पाएँगे।

टेम्प्लेट असाइन करना

किसी पेज या पोस्ट को नया टेम्प्लेट असाइन करने के लिए संबंधित सामग्री खोलें, इस मामले में मेरा About Page, और फिर दाईं ओर साइडबार सेटिंग खोलें। Template के आगे टेम्प्लेट के नाम पर क्लिक करें, Swap Template चुनें और फिर आप अपने पेज या पोस्ट को असाइन करने के लिए कोई कस्टम टेम्प्लेट चुन सकते हैं।

टेम्प्लेट प्रबंधित करना

यह भी उल्लेखनीय है कि जब आप Manage all templates पर क्लिक करके Bulk Edit चुनते हैं, तो आप टेबल या ग्रिड व्यू के माध्यम से अपने टेम्प्लेट को देख और फ़िल्टर कर सकते हैं। और जब आप फिर से Bulk Edit चुनते हैं, तो फ़िल्टर करने के और विकल्प मिलते हैं। कृपया ध्यान दें कि आप पेज और टेम्प्लेट पार्ट्स को भी बिल्कुल इसी तरह देख और फ़िल्टर कर सकते हैं।

पैटर्न

अंत में, आइए पैटर्न के बारे में बात करते हैं। सबसे ऊपर आप सभी उपलब्ध पैटर्न देख सकते हैं। जब आप My Patterns चुनते हैं, तो आप अपने स्वयं के कस्टम सिंक किए गए और गैर-सिंक किए गए पैटर्न बना और प्रबंधित कर सकते हैं। My Patterns के नीचे हम अपने सभी कस्टम पैटर्न और अपने थीम के साथ आने वाले पैटर्न को उनकी संबंधित श्रेणियों में देख सकते हैं। Template Parts के नीचे हम अपने हेडर, फुटर और सामान्य टेम्प्लेट पार्ट्स भी बना और प्रबंधित कर सकते हैं। टेम्प्लेट पार्ट्स मूल रूप से पैटर्न होते हैं। ये सिंक किए गए पुन: उपयोग योग्य घटक हैं, जिनका उपयोग आपकी पूरी साइट पर किया जा सकता है।

कस्टम पैटर्न

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

टेम्प्लेट पार्ट्स

सबसे नीचे हम अपने हेडर, फुटर और सामान्य टेम्प्लेट पार्ट्स बना और प्रबंधित कर सकते हैं। यहाँ आपके पास दो विकल्प हैं। आप कस्टम हेडर और फुटर बना सकते हैं या अपने थीम के साथ आने वाले टेम्प्लेट पार्ट पैटर्न को कस्टमाइज़ कर सकते हैं। अपना टेम्प्लेट पार्ट बनाने के लिए सबसे ऊपर पैटर्न के आगे दिए गए प्लस आइकन पर क्लिक करें और Create a template part चुनें। जब आप नया टेम्प्लेट पार्ट जोड़ते हैं, तो आप सामान्य हेडर और फुटर टेम्प्लेट पार्ट्स में से चुन सकते हैं। सामान्य टेम्प्लेट पार्ट्स किसी विशेष क्षेत्र से जुड़े नहीं होते, इसलिए उन्हें एक वर्णनात्मक नाम देना याद रखें। जब आप यहाँ से कोई टेम्प्लेट पार्ट खोलते हैं, तो आप बिना किसी व्यवधान के टेम्प्लेट संपादन मोड में अपने टेम्प्लेट पार्ट में बदलाव और संपादन कर पाएँगे। आप संबंधित टेम्प्लेट भी खोल सकते हैं और, इस मामले में, मेरे कस्टम टेम्प्लेट को खोलकर उसमें से अपने हेडर या फुटर टेम्प्लेट पार्ट में बदलाव कर सकते हैं। जैसा कि पहले दिखाया गया है, आप अपने किसी हेडर या फुटर को लाइब्रेरी के किसी पैटर्न या मौजूदा टेम्प्लेट पार्ट से आसानी से बदल सकते हैं।

कमांड पैलेट

अंत में, मैं Command palette नामक एक बेहद उपयोगी सुविधा पर भी प्रकाश डालना चाहता हूँ, जो आपका काफी समय बचाएगी और आपके साइट एडिटर में अधिक प्रभावी ढंग से घूमने में मदद करेगी। कमांड पैलेट आपको कार्यों को शीघ्रता से पूरा करने और साइट एडिटर में नेविगेट करने की सुविधा देता है। उदाहरण के लिए, आप पेज या टेम्प्लेट बनाने के लिए ‘New’ टाइप कर सकते हैं या उस क्षेत्र का नाम टाइप कर सकते हैं जहाँ आप जाना चाहते हैं। उदाहरण के लिए, अपने सभी पैटर्न प्रबंधित करने के लिए pattern। आप Mac पर command+k या Windows पर control+k शॉर्टकट का उपयोग करके कमांड पैलेट खोल सकते हैं। आप इसे साइट व्यू साइडबार में खोज आइकन पर क्लिक करके भी पा सकते हैं। या आप केवल टाइटल बार पर क्लिक कर सकते हैं।

निष्कर्ष

साइट एडिटर का उपयोग करके आप क्या-क्या कर सकते हैं, इसके हमारे संक्षिप्त अवलोकन का यही अंत है।

व्यावहारिक अभ्यास

साइट एडिटर को explore करने के लिए WordPress Playground का उपयोग करें।

• साइट एडिटर के विभिन्न क्षेत्रों के बीच नेविगेट करने का अभ्यास करें।
  • साइट एडिटर में अधिक तेज़ी से नेविगेट करने के लिए Command Palette का उपयोग करें।
• पेज और टेम्प्लेट के बीच के अंतर की तुलना करें।