हेडर आपके स्टोर के सबसे ऊपर की पट्टी है, जिसमें आपका लोगो, मेन्यू, खोज, कार्ट और देश चुनने का विकल्प होता है। यह आर्टिकल हेडर की हर सेटिंग और उसके पाँच ब्लॉक समझाता है।
यह कहाँ मिलेगा
बिल्डर खोलें और प्रीव्यू में हेडर पर क्लिक करें, या सेक्शन टैब में हेडर चुनें। नया हेडर जोड़ने के लिए नया सेक्शन जोड़ें पर क्लिक करें और लेआउट ग्रुप में हेडर चुनें। हर पेज पर एक हेडर हो सकता है, किसी भी पेज पर। हर पेज अपनी अलग कॉपी रखता है, इसलिए काम पूरा होने के बाद सभी पेजों पर लागू करें इस्तेमाल करें, देखें सेक्शन और ब्लॉक।
हेडर में हमेशा यही पाँच ब्लॉक होते हैं: लोगो, मेन्यू, खोजें, कार्ट और लोकलाइज़ेशन। आप इन्हें जोड़, हटा या इनका क्रम नहीं बदल सकते। आप इन्हें इनकी अपनी पोज़िशन और रो सेटिंग्स से जगह पर रखते हैं।
हेडर की सेटिंग्स
- स्टिकी हेडर: ऊपर स्क्रॉल करने पर हेडर को तब छिपाता है जब ग्राहक नीचे स्क्रॉल करते हैं, और ऊपर स्क्रॉल करने पर वापस ले आता है। हमेशा इसे सबसे ऊपर रखता है। छोटे लोगो के साथ स्टिकी इसे सबसे ऊपर रखता है और ग्राहक के स्क्रॉल करते ही छोटा कर देता है (कम पैडिंग, छोटा लोगो)। कभी नहीं इसे पेज के साथ ऊपर स्क्रॉल होकर चले जाने देता है।
- चौड़ाई: पेज कंटेंट को आपके पेज की चौड़ाई में रखता है, पूरा इसे एक किनारे से दूसरे किनारे तक फैला देता है।
- कलर स्कीम: हेडर का बैकग्राउंड, टेक्स्ट और लिंक के रंग।
- पारदर्शी हेडर: हेडर का बैकग्राउंड हटा देता है ताकि हीरो इमेज उसके पीछे से दिखे। नीचे देखें।
- पैडिंग (ऊपर, बाएँ, दाएँ, नीचे) और कस्टम CSS टैब।
पारदर्शी हेडर
यह तभी काम करता है जब हेडर के ठीक नीचे पहला दिखने वाला सेक्शन हीरो हो, क्योंकि हेडर अपने टेक्स्ट और आइकन के लिए हीरो की कलर स्कीम उधार लेता है। यह अपना बैकग्राउंड, बॉर्डर और शैडो हटा देता है, और अपने पीछे की चीज़ों को हल्का धुंधला कर देता है। जब ग्राहक हीरो से आगे स्क्रॉल करते हैं, तो हेडर को अपने रंग वापस मिल जाते हैं। खोज पैनल और देशों की सूची हेडर के अपने रंग ही रखते हैं। हीरो की सेटिंग्स हीरो सेक्शन में हैं।
लोगो
- लोगो: अपनी लोगो इमेज चुनें। इमेज न होने पर आपके स्टोर का नाम टेक्स्ट के रूप में दिखता है।
- पोज़िशन: बाएँ, बीच में या दाएँ। चौड़ाई और ऊँचाई: पिक्सेल में लोगो बॉक्स का साइज़।
- डेस्कटॉप पैडिंग: लोगो के आसपास की जगह, सिर्फ़ कंप्यूटर पर।
लोगो पर क्लिक करने से आपका होम पेज खुलता है। इसे रोकने के लिए लोगो पर क्लिक करके होम पर जाने से रोकें चालू करें, देखें रोक की सेटिंग्स।
मेन्यू
मेन्यू में अपना कोई एक मेन्यू चुनें। मेन्यू चुनने के बाद बाकी सेटिंग्स दिखती हैं। मेन्यू बनाने का तरीका नेविगेशन मेन्यू कैसे बनाएँ और उन्हें अपने हेडर और फ़ुटर में कैसे जोड़ें? में है।
- प्रकार: मेगा (कॉलम वाले बड़े पैनल), ड्रॉपडाउन (सादी सूचियाँ), या ड्रॉअर (मेन्यू बटन से खुलने वाला साइड पैनल)।
- पोज़िशन और रो: मेन्यू कहाँ रहेगा। ऊपर लोगो वाली मुख्य रो है, नीचे उसके नीचे एक दूसरी रो जोड़ता है। ड्रॉअर के लिए नहीं दिखता।
- कलर स्कीम: खुले मेन्यू पैनल के रंग।
- मोबाइल लेआउट: फ़ोन और टैबलेट पर मेन्यू एक ड्रॉअर में चला जाता है। इसके बजाय इसे हेडर के नीचे एक बार के रूप में दिखाने के लिए नेविगेशन बार चालू करें, जिसकी अपनी नेविगेशन बार की कलर स्कीम होती है। ड्रॉअर के लिए नहीं दिखता।
खोज, कार्ट और लोकलाइज़ेशन
- खोजें: एक खोज आइकन जो खोज फ़ील्ड खोलता है। पोज़िशन (बाएँ या दाएँ) और रो सेट करें।
- कार्ट: आइटम की संख्या के साथ कार्ट आइकन। कार्ट का टाइपड्रॉअर (साइड पैनल), ड्रॉपडाउन (आइकन के नीचे छोटा कार्ट), या पेज (कार्ट पेज खोलता है) होता है। कलर स्कीम ड्रॉअर या ड्रॉपडाउन की स्टाइल तय करती है। ड्रॉअर और ड्रॉपडाउन में फ़्री शिपिंग बार का स्विच भी है, देखें फ़्री शिपिंग बार कैसे काम करता है?।
- लोकलाइज़ेशन: एक बटन जो आपके मार्केट की सूची दिखाता है ताकि ग्राहक देश बदल सकें। इसे दिखाने के लिए देश चुनने का विकल्प चालू करें। झंडे दिखाएँ बटन पर मौजूदा देश का झंडा दिखाता है, वरना ग्लोब आइकन दिखता है। पोज़िशन और रो सेट करें।
जानने लायक बातें
- पारदर्शी हेडर कुछ नहीं करता: जाँचें कि हीरो हेडर के ठीक नीचे है। बीच में अनाउंसमेंट बार या कोई दूसरा सेक्शन हो तो यह काम नहीं करता।
- देश चुनने का विकल्प नहीं दिखता: इसके लिए कम से कम दो मार्केट चाहिए, देखें कई देशों में बेचने के लिए मार्केट कैसे सेट अप करें?।
- मेन्यू आइटम गायब हैं: हेडर को नहीं, खुद मेन्यू को एडिट करें।