अपीयरेंस
अपीयरेंस पृष्ठ आपको अपनी चर्च वेबसाइट के समग्र रूप और अनुभव को अनुकूलित करने देता है। रंगों और फ़ॉन्ट से लेकर स्पेसिंग और कस्टम CSS तक, आप एक ही स्थान से अपनी साइट के हर दृश्य पहलू को नियंत्रित कर सकते हैं।
शुरू करने से पहले
- अपनी वेबसाइट के लिए प्रारंभिक सेटअप पूरा करें
- पारदर्शी पृष्ठभूमि और 4:1 पहलू अनुपात के साथ PNG प्रारूप में अपना चर्च लोगो तैयार रखें
- यदि आपके पास कोई मौजूदा स्टाइल गाइड है तो अपने चर्च के ब्रांड रंग (हेक्स वैल्यू) जानें
अपीयरेंस सेटिंग्स तक पहुंचना
- B1 Admin में, बाएं मेनू में Website पर क्लिक करें।
- Website Pages दृश्य के शीर्ष पर Appearance टैब पर क्लिक करें।
- बाईं ओर आपकी वेबसाइट का लाइव पूर्वावलोकन और दाईं ओर Style Settings विकल्पों के साथ Site Styles पृष्ठ लोड होता है।
रंग पैलेट
- Style Settings पैनल में Color Palette पर क्लिक करें।
- आपको Base Colors (हल्के, एक्सेंट, और गहरे शेड) और Semantic Colors (Primary, Secondary, Success, Warning, और Error) दिखाई देंगे।
- रंग पिकर खोलने के लिए किसी भी रंग स्वैच पर क्लिक करें। सेलेक्टर को ड्रैग करें या अपना रंग चुनने के लिए हेक्स वैल्यू दर्ज करें।
- Color Combinations Preview दिखाता है कि आपके चुने हुए रंग एक साथ कैसे काम करते हैं।
- त्वरित रूप से पूर्व-डिज़ाइन की गई रंग योजना लागू करने के लिए Suggested Palettes का उपयोग करें।
- जब आप संतुष्ट हों तो Save पर क्लिक करें।
टाइपोग्राफी
- Style Settings पैनल में Typography Settings पर क्लिक करें।
- फ़ॉन्ट ब्राउज़र खोलने के लिए Select a Font पर क्लिक करें। आप नाम से खोज सकते हैं या Serif, Sans Serif, Display, Handwriting, और Monospace जैसी श्रेणियों को ब्राउज़ कर सकते हैं।
- शीर्षकों और मुख्य टेक्स्ट दोनों के लिए फ़ॉन्ट सेट करें।
- Heading 1 से Heading 4 तक आकार पदानुक्रम को समायोजित करने के लिए Typography Scale पर क्लिक करें। फ़ाइन-ट्यून करने के लिए स्केल मल्टीप्लायर और बेस साइज़ फ़ील्ड का उपयोग करें।
- अपने फ़ॉन्ट विकल्प लागू करने के लिए Save पर क्लिक करें।
स्पेसिंग
- Style Settings पैनल में Spacing Scale पर क्लिक करें।
- Extra Small से Extra Large तक स्पेसिंग मानों को समायोजित करें। व्यावहारिक उदाहरण दिखाते हैं कि प्रत्येक मान लेआउट को कैसे प्रभावित करता है।
- अपनी पूरी साइट पर मान लागू करने के लिए Save Spacing पर क्लिक करें।
लोगो और ब्रांडिंग
- Style Settings पैनल में Logo पर क्लिक करें।
- अपना Light Background Logo और Dark Background Logo अपलोड करें। सर्वोत्तम परिणामों के लिए पारदर्शी पृष्ठभूमि और 4:1 पहलू अनुपात वाली छवियों का उपयोग करें।
- लिंक पूर्वावलोकन के लिए एक Social Media Image और ब्राउज़र टैब आइकन के लिए एक Favicon अपलोड करें।
सर्वोत्तम परिणामों के लिए, PNG प्रारूप में पारदर्शी पृष्ठभूमि वाले लोगो का उपयोग करें। यह सुनिश्चित करता है कि यह आपकी वेबसाइट और मोबाइल ऐप दोनों पर हल्के और गहरे पृष्ठभूमि पर बढ़िया दिखे।
कस्टम CSS और JavaScript
- Style Settings पैनल में CSS and Javascript पर क्लिक करें।
- उन्नत अनुकूलन के लिए डिफ़ॉल्ट स्टाइल ओवरराइड करने के लिए Custom CSS जोड़ें।
- ट्रैकिंग कोड या अन्य स्क्रिप्ट के लिए Custom HTML जोड़ें।
- Google Analytics एकीकरण जैसे स्निपेट के लिए Common Javascript Examples अनुभाग का उपयोग करें।
कस्टम CSS शक्तिशाली है लेकिन गलत तरीके से उपयोग करने पर आपकी साइट का लेआउट खराब कर सकता है। अधिकांश चर्च अंतर्निहित रंग, फ़ॉन्ट और स्पेसिंग नियंत्रणों का उपयोग करके वांछित लुक प्राप्त कर सकते हैं। कस्टम CSS का उपयोग केवल तभी करें जब आप वेब विकास में सहज हों।
स्टाइल थीम
यदि आप एक त्वरित शुरुआत बिंदु चाहते हैं, तो Color Palette अनुभाग में Suggested Palettes एक क्लिक में समन्वित रंग सेट करने वाली पूर्व-निर्मित थीम प्रदान करती हैं। थीम लागू करने के बाद आप हमेशा व्यक्तिगत सेटिंग्स को फ़ाइन-ट्यून कर सकते हैं।
अगले कदम
- पृष्ठ प्रबंधन -- अपने वेबसाइट पृष्ठ बनाएं और व्यवस्थित करें
- फ़ाइलें -- अपनी साइट के लिए मीडिया संपत्तियां अपलोड करें