डिज़ाइन: रंग, बैकग्राउंड और फ़ॉन्ट

बिल्डर के “थीम” टैब में आप पूरे पेज का रूप-रंग तय करते हैं: रंग, बैकग्राउंड, बटन का आकार और फ़ॉन्ट। कस्टम CSS को छोड़कर सभी बदलाव लगभग 2 सेकंड बाद अपने आप ड्राफ़्ट में सहेजे जाते हैं और अगली बार पब्लिश करने पर लाइव होते हैं।

टैब ऊपर से नीचे इस तरह बना है: “टेम्पलेट”, “प्रीसेट”, “रंग”, “बैकग्राउंड”, “कंटेंट के पीछे सतह”, “बटन की शैली”, “फ़ॉन्ट” और “कस्टम CSS”। टेम्पलेट का अपना अलग लेख है।

#प्रीसेट

प्रीसेट पहले से तैयार रंगों के मेल हैं। एक क्लिक बैकग्राउंड का रंग, टेक्स्ट का रंग, बटन का रंग और बटन की शैली एक साथ सेट करता है और आपका अपना बटन टेक्स्ट रंग रीसेट कर देता है। 16 प्रीसेट हैं: Classic, Midnight, Harbor, Ocean, Forest, Sunset, Rose, Slate, Mono, Frost, Lavender, Amber, Charcoal, Mint, Crimson और Sand। सक्रिय प्रीसेट तब तक चिह्नित रहता है जब तक आप चारों में से कोई वैल्यू नहीं बदलते।

#रंग

चार मूल रंग, हर एक कलर पिकर और hex वैल्यू के साथ (कोई पारदर्शिता नहीं):

“बैकग्राउंड”

पेज का बैकग्राउंड रंग; बैकग्राउंड प्रकार “रंग” होने पर भी इस्तेमाल होता है।

“टेक्स्ट का रंग”

नाम, बायो और टेक्स्ट का रंग।

“बटन”

लिंक बटन का रंग और ब्लॉक के बटन का डिफ़ॉल्ट रंग।

“बटन टेक्स्ट”

बटन पर टेक्स्ट। अपने चुनाव के बिना बटन के रंग पर अच्छी तरह पढ़ा जाने वाला रंग अपने आप चुना जाता है।

दिखाई गई वैल्यू हमेशा वही होती है जो अभी लागू है, भले ही वह टेम्पलेट से आई हो। कई ब्लॉक के “डिस्प्ले विकल्प” के तहत अपने रंग फ़ील्ड होते हैं। जब तक वे “डिफ़ॉल्ट (थीम से)” दिखाते हैं, वे इन्हीं रंगों के हिसाब से चलते हैं।

#बैकग्राउंड

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

रंग

पेज “रंग” हिस्से का “बैकग्राउंड” रंग इस्तेमाल करता है।

इमेज

“डेस्कटॉप इमेज”

बड़ी स्क्रीन के लिए बैकग्राउंड, 1920 × 1080 px।

“मोबाइल इमेज”

वैकल्पिक, खड़ी 1080 × 1920 px। ख़ाली होने पर “डेस्कटॉप जैसा” दिखता है, और डेस्कटॉप इमेज इस्तेमाल होती है।

“चुनें” आपकी फ़ाइलें खोलता है, “मैनेज करें ↗” फ़ाइलें पेज, “हटाएँ” इमेज निकाल देता है। अगर कोई इमेज ठीक लक्ष्य साइज़ की नहीं है, तो क्रॉप टूल खुलता है और क्रॉप की गई इमेज एक नई फ़ाइल के रूप में सहेजी जाती है। ज़्यादा जानकारी पेज बिल्डर में इमेज में।

ग्रेडिएंट

“शुरुआती रंग” और “अंतिम रंग”

ग्रेडिएंट के दो रंग।

“कोण”

0 से 355 डिग्री तक दिशा, 5 के क़दमों में।

“प्रीसेट”

पहले से तैयार ग्रेडिएंट: Indigo, Sunset, Ocean, Forest, Berry और Midnight।

वीडियो

“डेस्कटॉप वीडियो”

किसी वीडियो फ़ाइल (.mp4 या .webm) का सीधा लिंक, या आपकी वीडियो फ़ाइलों में से “वीडियो चुनें”।

“मोबाइल वीडियो”

वैकल्पिक, जैसे मोबाइल डेटा के लिए छोटी फ़ाइल। ख़ाली होने पर डेस्कटॉप वीडियो इस्तेमाल होता है।

वीडियो बिना आवाज़ के और लूप में चलता है, बिना कंट्रोल के। जिन विज़िटरों ने अपनी सिस्टम सेटिंग में कम मोशन चालू किया है, उनके लिए यह छिपा रहता है। MP4 या WebM फ़ॉर्मैट में 8 MB तक की फ़ाइलें सुझाई जाती हैं।

ओवरले पारदर्शिता

इमेज, ग्रेडिएंट और वीडियो के लिए 0 से 80% तक का एक स्लाइडर बैकग्राउंड पर एक गहरी परत डालता है, ताकि टेक्स्ट पढ़ना आसान हो।

इमेज, ग्रेडिएंट या वीडियो से बना पेज बैकग्राउंड टेम्पलेट की बैकग्राउंड इमेज की जगह ले लेता है। तब टेम्पलेट के इमेज स्लॉट इसकी सूचना दिखाते हैं। “रंग” के साथ टेम्पलेट की इमेज फिर दिखती हैं।

#कंटेंट के पीछे सतह

बैकग्राउंड इमेज, ग्रेडिएंट या वीडियो पर टेक्स्ट को पढ़ने लायक बनाता है:

“बंद”

कोई सतह नहीं; कंटेंट सीधे बैकग्राउंड पर होता है।

“पूरा कंटेंट”

पूरे कंटेंट के पीछे एक कार्ड।

“हर ब्लॉक”

प्रोफ़ाइल के पीछे और हर ब्लॉक के पीछे एक अलग कार्ड।

“ठोस” या “अर्धपारदर्शी”

सतह चालू होते ही दिखता है। अर्धपारदर्शी बैकग्राउंड को झलकने देता है।

Business Card टेम्पलेट के साथ इस सेटिंग का कोई असर नहीं होता।

#बटन की शैली

बटन की शैली डिफ़ॉल्ट है। आप इसे लिंक ब्लॉक में और हर लिंक के लिए बदल सकते हैं (दोनों जगह “कोने की गोलाई”)।

#फ़ॉन्ट

आप DM Sans, Figtree, Sora, Plus Jakarta Sans, Raleway, Inter, Poppins, Montserrat, Nunito, Outfit, Space Grotesk और “सिस्टम डिफ़ॉल्ट” (डिवाइस का अपना फ़ॉन्ट) में से चुन सकते हैं। “Aa — फुर्तीली भूरी लोमड़ी।” लाइन पूर्वावलोकन दिखाती है।

LinkHarbor सभी फ़ॉन्ट ख़ुद देता है। आपके विज़िटरों के ब्राउज़र इनके लिए Google Fonts या तीसरे पक्ष के दूसरे सर्वर से कुछ लोड नहीं करते।

#कौन-सी सेटिंग जीतती है

रंग और आकार बाहर से अंदर की ओर बारीक होते जाते हैं:

1. टेम्पलेट: बुनियादी स्टाइल और डिफ़ॉल्ट रंग
2. थीम टैब: पूरे पेज के लिए रंग, बैकग्राउंड, बटन की शैली और फ़ॉन्ट
3. किसी ब्लॉक के डिस्प्ले विकल्प: उस ब्लॉक के लिए रंग और आकार
4. किसी एक लिंक की स्टाइलिंग: बाकी सभी वैल्यू से ऊपर प्राथमिकता
5. कस्टम CSS: उन सब चीज़ों के लिए जो कंट्रोल कवर नहीं करते

अपने CSS से बारीक बदलाव कैसे करें, यह कस्टम CSS में बताया गया है।