वर्डप्रेस में हेडर कैसे जोड़ें? अपनी हेडर छवि को अनुकूलित करने के लिए वर्डप्रेस कस्टमाइज़र या कवर ब्लॉक का उपयोग करें

वर्डप्रेस में हेडर कैसे जोड़ें? अपनी हेडर छवि को अनुकूलित करने के लिए वर्डप्रेस कस्टमाइज़र या कवर ब्लॉक का उपयोग करें

आप हमसे सहमत हो सकते हैं कि कोई भी वेबसाइट हेडर के बिना पूरी नहीं होती। क्या आप जानते हैं कि वर्डप्रेस में हेडर बनाने के लिए आपके पास दो अलग-अलग विकल्प हैं? इस ट्यूटोरियल में हम व्यक्तिगत अंतर समझाएंगे।

असली हेडर छवि

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

वर्डप्रेस हेडर छवि
सबसे अधिक उपयोग किया जाने वाला हेडर प्रकार - वेबसाइट के शीर्ष पर हेडर छवि

वर्डप्रेस कस्टमाइज़र में हेडर कैसे संपादित करें

डिफ़ॉल्ट रूप से, हेडर छवि को वर्डप्रेस कस्टमाइज़र के माध्यम से बदला जा सकता है। आप इसे वर्डप्रेस एडमिन और अपनी वेबसाइट दोनों से एक्सेस कर सकते हैं:

  • सीधे WP एडमिन से, बस नेविगेट करें उपस्थिति –> अनुकूलित करें
  • फ्रंटएंड पर, यदि आप लॉग इन हैं, तो शीर्ष बार में "कस्टमाइज़" पर क्लिक करें

कस्टमाइज़र में आपकी वर्तमान में सक्रिय थीम की सभी बुनियादी उपस्थिति सेटिंग्स शामिल हैं। इसलिए हेडर छवि सेटिंग्स कहां खोजें यह आपकी सक्रिय थीम पर निर्भर करता है। Citadela थीम में आप हेडर इमेज जोड़ और संपादित कर सकते हैं अनुकूलित -> उपस्थिति -> शीर्षक पृष्ठभूमि.

कस्टमाइज़र के माध्यम से हेडर जोड़ें
कस्टमाइज़र के माध्यम से हेडर जोड़ना

हेडर छवि सेटिंग्स

इससे कोई फर्क नहीं पड़ता कि आप कौन सी हेडर छवि चुनते हैं, आप इसे अपनी आवश्यकताओं के अनुसार कॉन्फ़िगर कर सकते हैं। "हेडर इमेज रिपीट" का उपयोग करके दिलचस्प प्रभाव प्राप्त किया जा सकता है। आप निम्नलिखित विकल्पों को कॉन्फ़िगर कर सकते हैं:

  • टाइल
  • क्षैतिज रूप से टाइल
  • लंबवत टाइल
  • कोई दोहराव नहीं (यदि आप छवि दोहराना नहीं चाहते हैं)
सक्षम हेडर इमेज रिपीट सुविधा
हेडर छवि का टाइल प्रभाव

वर्डप्रेस में अन्य सेटिंग्स - हेडर छवि का आकार

हेडर को संपादित करने और छवि को समायोजित करने का एक अन्य विकल्प उपयुक्त आकार निर्धारित करना है। हेडर छवि आकार में निम्नलिखित तीन विकल्प हैं:

  • मूल – यह मूल छवि आकार बनाए रखेगा
  • ढकना - अपलोड की गई छवि को एक तरफ से दूसरी तरफ फिट करने के लिए आकार दिया जाएगा, छवि को फिट करने के लिए काटा भी जा सकता है
  • रोकना - हेडर छवि का आकार इस तरह समायोजित किया जाएगा कि पूरी छवि दिखाई देगी
हेडर छवि आकार के 3 विकल्प
देखें कि हेडर अपने आकार के आधार पर कितना भिन्न दिख सकता है - मूल, कवर और सम्मिलित आकार

आप हेडर के भीतर छवि स्थिति भी सेट कर सकते हैं और पृष्ठभूमि निर्धारण सेट कर सकते हैं।

कवर ब्लॉक जो हेडर के रूप में काम करता है

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

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

कवर ब्लॉक का उपयोग कहां करें

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

ब्लॉगपोस्ट में हेडर इमेज के रूप में कवर इमेज
कवर ब्लॉक के माध्यम से हेडर छवि के साथ ब्लॉगपोस्ट जोड़ा गया

मुखपृष्ठ शीर्षलेख

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

पूर्ण चौड़ाई वाली पृष्ठभूमि छवि के रूप में हेडर
मुखपृष्ठ पर पूर्ण चौड़ाई वाला शीर्षलेख

कवर ब्लॉक का उपयोग करके हेडर कैसे बनाएं

सबसे पहले आपको कवर ब्लॉक जोड़ना होगा। आप इसे किसी भी पेज पर जोड़ सकते हैं या निम्न तरीके से पोस्ट कर सकते हैं:

शीर्ष बार में "+" चिह्न या सामग्री में कहीं भी "+" चिह्न पर क्लिक करें। उसके बाद बस कवर ब्लॉक खोजें।

"+" पर क्लिक करके कवर ब्लॉक जोड़ें
"+" का उपयोग करके कवर ब्लॉक जोड़ना

दूसरा त्वरित तरीका ब्लॉक नाम के बाद "/" का उपयोग करके ब्लॉक जोड़ना है।

कवर ब्लॉक जोड़ने के लिए स्लैश का उपयोग करना
इस ब्लॉक को सामग्री क्षेत्र में जोड़ने के लिए स्लैश जोड़ें और कवर ब्लॉक टाइप करें

कवर ब्लॉक जोड़ने के बाद आपको छवि या वीडियो अपलोड करने के लिए एक स्थान मिलेगा। आप मीडिया लाइब्रेरी से भी छवि का चयन कर सकते हैं. चयनित छवि या वीडियो का उपयोग हेडर के रूप में किया जाएगा।

शीर्षलेख शीर्षक

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

हेडर छवि में शीर्षक
हेडर छवि में शीर्षक

कवर ब्लॉक को संरेखित करना

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

कवर ब्लॉक संरेखण
आप अपने हेडर का सही लुक पाने के लिए अपने कवर ब्लॉक को कई तरीकों से संरेखित कर सकते हैं

छवि सेटिंग्स को कवर करें

इंस्पेक्टर में कवर छवि उपस्थिति को संशोधित किया जा सकता है। यदि आप इसे निश्चित पृष्ठभूमि के रूप में सेट करते हैं, तो छवि आपके पृष्ठ पर शेष सामग्री के साथ स्क्रॉल नहीं करेगी, बल्कि यह हर समय अपनी जगह पर बनी रहेगी।

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

रंग ओवरले और अपारदर्शिता सेट करें
उचित रंग ओवरले का चयन करके आप ध्यान आकर्षित करने वाला हेडर बना सकते हैं

वीडियो हेडर बनाना

कवर ब्लॉक का उपयोग आपकी वेबसाइट हेडर के अंदर वीडियो चलाने के लिए भी किया जा सकता है। आप आगंतुकों का ध्यान आकर्षित कर सकते हैं या उत्पाद या सेवा का प्रचार कर सकते हैं। वहाँ हैं कई समर्थित वीडियो प्रारूप, सबसे आम उपयोग जो आप कर सकते हैं वह है .mp4।

अच्छी बात यह है कि आप वीडियो पर शीर्षक भी लिख सकते हैं, उसे संरेखित कर सकते हैं, उसे पूरी चौड़ाई में बना सकते हैं या कलर ओवरले सेट कर सकते हैं। कवर ब्लॉक की सेटिंग्स सभी मीडिया प्रकारों के लिए समान हैं।

हेडर के साथ आपका अनुभव क्या है? क्या आपने हेडर बनाने के लिए पहले ही कवर ब्लॉक आज़मा लिया है? क्या आप वर्डप्रेस कस्टमाइज़र का उपयोग करके क्लासिक वेबसाइट हेडर पसंद करते हैं? नीचे टिप्पणी करके हमें बताएं।