पूरे स्टोर या किसी एक सेक्शन में कस्टम CSS कैसे जोड़ें?

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

पूरे स्टोर के लिए कस्टम CSS

गियर आइकन पर क्लिक करें और कस्टम CSS टैब खोलें। बॉक्स का नाम CSS कोड है: पूरे स्टोर पर लागू होता है। आपकी CSS उस मार्केट के हर पेज पर लोड होती है जिसे आप एडिट कर रहे हैं, और प्रीव्यू में नतीजा दिखता है।

इसे उन नियमों के लिए इस्तेमाल करें जो हर जगह लागू होने चाहिए, जैसे सभी पेजों पर कोई चीज़ छिपाना या हर बटन का स्टाइल बदलना। उदाहरण के लिए, h1 { text-transform: uppercase; } हर पेज का मुख्य टाइटल कैपिटल अक्षरों में लिखता है।

एक सेक्शन के लिए कस्टम CSS

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

यह ज़्यादा सुरक्षित विकल्प है। Storeep आपके हर सिलेक्टर के आगे वह सेक्शन जोड़ देता है, इसलिए आपके नियम उसके बाहर कुछ नहीं बदल सकते।

• h2 { letter-spacing: 2px; } सिर्फ़ इस सेक्शन के अंदर के टाइटल बदलता है।
• सेक्शन को खुद स्टाइल करने के लिए & इस्तेमाल करें: & { border-top: 1px solid #000; }।
• @media नियम काम करते हैं। उनके अंदर के नियम भी सेक्शन तक ही सीमित रहते हैं।
• @keyframes एनिमेशन वैसे ही रहते हैं जैसे आपने लिखे हैं।

सेक्शन की CSS उसी पेज के उसी सेक्शन की होती है। सेक्शन को उसकी CSS के साथ उन दूसरे पेजों पर कॉपी करने के लिए जिनमें वह सेक्शन है, सेक्शन पर सभी पेजों पर लागू करें इस्तेमाल करें। देखें सभी पेजों पर लागू करें।

कौन सा इस्तेमाल करें

• एक सेक्शन गलत दिखता है: उस सेक्शन की कस्टम CSS इस्तेमाल करें।
• एक ही बदलाव हर जगह चाहिए: कस्टम CSS सेटिंग्स टैब इस्तेमाल करें।
• CSS लिखने से पहले देखें कि कोई सेटिंग पहले से यह काम करती है या नहीं: रंग कलर स्कीम में हैं, फ़ॉन्ट फ़ॉन्ट सेटिंग्स में, और कोने और शैडो आपकी थीम से आते हैं।

जब आपकी CSS काम न करे

• देखें कि कहीं } या ; छूट तो नहीं गया। एक गलती उसके बाद के सारे नियम रोक सकती है।
• हो सकता है आपका नियम थीम के नियम से कमज़ोर हो। सिलेक्टर को और सटीक बनाएँ।
• सेक्शन CSS में अपना सिलेक्टर body या html से शुरू न करें। वे सेक्शन के बाहर हैं, इसलिए नियम मेल नहीं खाएगा।
• अगर पेज टूटा हुआ दिखे, तो अपना आखिरी बदलाव हटाएँ, पब्लिश करें, और नियम एक एक करके वापस जोड़ें।

ध्यान रखें

• कस्टम CSS उस मार्केट की है जिसे आप एडिट कर रहे हैं। जिस भी मार्केट में ज़रूरत हो, उसमें इसे दोहराएँ।
• थीम बदलने से क्लास के नाम और लेआउट बदल सकते हैं, इसलिए थीम बदलने के बाद अपनी कस्टम CSS जाँचें।
• बदलाव तब लाइव होते हैं जब आप पब्लिश करें पर क्लिक करते हैं।
• किसी पेज के अंदर HTML और कोड के लिए देखें कस्टम कोड।