एलिमेंट्स

एलिमेंट्स कॉन्टेंट को प्रभावी ढंग से स्ट्रक्चर और प्रज़ेंट करने में मदद करते हैं। इनमें टेक्स्ट-बेस्ड कॉम्पोनेंट्स जैसे टाइटल्स, लिस्ट्स और टेक्स्ट हाइलाइट्स से लेकर इंटरैक्टिव कॉम्पोनेंट्स जैसे बटन और लिंक्स शामिल होते हैं। विज़ुअल एलिमेंट्स जैसे इमेज, आइकॉन, वीडियो, और एनिमेशन्स को भी कॉन्टेंट प्रज़ेंटेशन और ऑर्गनाइज़ेशन को बेहतर बनाने के लिए जोड़ा जा सकता है।

वेबसाइट एलिमेंट जोड़ने या मॉडिफ़ाई करने के लिए:

  1. संबंधित वेबसाइट पेज पर नेविगेट करें और बदलाव करें पर क्लिक करें।

  2. पेज पर उस सेक्शन पर क्लिक करें जहां आप कोई एलिमेंट जोड़ना या बदलना चाहते हैं।

  3. जरूरी बदलाव करें।

  4. सेव करें पर क्लिक करें।

टिप्पणी

उदाहरण के लिए, हेडिंग, बटन, लिंक और पैराग्राफ टेक्स्ट के लिए डिफ़ॉल्ट स्टाइल वेबसाइट एडिटर के थीम टैब में तय किए गए हैं।

वेबसाइट एलिमेंट जोड़ने के लिए / टाइप करें।

टाइटल

टाइटल हेडिंग तय करते हैं और वेबसाइट कॉन्टेंट को स्पष्टता और संरचना के लिए अलग-अलग लेवल में व्यवस्थित करते हैं। टाइटल डालने के लिए, /title टाइप करें, हेडिंग स्टाइल (हेडिंग 1, हेडिंग 2, या हेडिंग 3) चुनें, और टेक्स्ट टाइप करें।

सलाह

वैकल्पिक रूप से, टेक्स्ट टाइप करें, उसे सेलेक्ट करें, और वेबसाइट एडिटर के कस्टमाइज़ टैब में इनलाइन टेक्स्ट सेक्शन से उपयुक्त स्टाइल चुनें। इस सेक्शन में अतिरिक्त फ़ॉर्मेटिंग विकल्प, जैसे फ़ॉन्ट और रंग, भी उपलब्ध हैं।

बटन

बटन इंटरैक्टिव एलिमेंट हैं जो किसी दूसरे पेज या पेज एंकर से लिंक करने की अनुमति देते हैं। बटन डालने के लिए:

  1. /button टाइप करें।

  2. लिंक लेबल फ़ील्ड में बटन का लेबल दर्ज करें।

  3. यूआरएल या ईमेल जोड़ें। पेज खोजने के लिए / टाइप करें और एंकर से लिंक करने के लिए # टाइप करें।

  4. बटन की दिखावट तय करने के लिए स्टाइल, साइज़, और लेआउट सेट करें।

  5. अगर जरूरत हो, तो लिंक किए गए पेज या एंकर को नए टैब में खोलने के लिए स्विच टॉगल करें।

  6. बदलाव सेव करने के लिए अप्लाई करें पर क्लिक करें।

सलाह

मौजूदा बटन में बदलाव करने के लिए, बटन पर क्लिक करें और वेबसाइट एडिटर के इनलाइन टेक्स्ट सेक्शन में विकल्प बदलें।

इमेज

इमेज डालने के लिए:

  1. /image टाइप करें।

  2. Unsplash डेटाबेस खोजें या अपनी लोकल इमेज से फ़ाइल चुनने के लिए इमेज अपलोड करें पर क्लिक करें।

  3. जोड़ें पर क्लिक करें।

  4. इमेज को कस्टमाइज़ करने के लिए, इमेज पर क्लिक करें और वेबसाइट एडिटर के Image सेक्शन में ऑप्शन बदलाव करें। उदाहरण:

    • इमेज को Replace करें।

    • alt tag को Description फ़ील्ड में डिफ़ाइन करें।

    • Tooltip फ़ील्ड में टाइटल टैग एंटर करें। यह टेक्स्ट तब दिखाई देगा जब विज़िटर इमेज पर अपना माउस होवर करेंगे।

    • Shape जोड़ें; कुछ शेप में कलर कस्टमाइज़ेशन की भी अनुमति मिलती है।

    • इमेज की Width एडजस्ट करें, जैसे परफ़ॉर्मेंस बेहतर बनाने के लिए। अगर डिस्प्ले के लिए छोटा साइज़ काफ़ी है तो वह सुझाया जा सकता है।

    • Transform टूल इस्तेमाल करके इमेज रिसाइज़ करें।

    • इमेज के चारों ओर स्पेस (पिक्सेल में) जोड़ने के लिए Padding एडजस्ट करें।

    • आदि।

वीडियो

वीडियो जोड़ने के लिए, /video टाइप करें, यूआरएल इन्सर्ट करें, और वांछित ऑप्शन ऑन करें:

  • Autoplay: पेज एक्सेस होने पर वीडियो ऑटोमैटिकली प्ले करने के लिए। वीडियो डिफ़ॉल्ट रूप से ऑटोमैटिकली म्यूट होता है।

  • Loop: वीडियो को लूप पर प्ले करने के लिए।

  • Hide player controls

  • Hide fullscreen button

आइकॉन

आइकॉन इन्सर्ट करने के लिए, /image टाइप करें, Icons टैब पर जाएं, एक आइकॉन सेलेक्ट करें, और Add पर क्लिक करें। आइकॉन में बदलाव करने के लिए, उस पर क्लिक करें और वेबसाइट एडिटर के Icon सेक्शन का इस्तेमाल करके ऑप्शन कस्टमाइज़ करें, जैसे Color, Size, Animations, Shape, आदि।

लिस्ट

लिस्ट कॉन्टेंट को साफ़ तरीके से ऑर्गनाइज़ करने में मदद करती हैं, जिससे जानकारी पढ़ने में आसान होती है और वेब पेज की स्ट्रक्चर बेहतर होती है। /list टाइप करें और तीन अलग-अलग टाइप की लिस्ट में से चुनें: Bulleted lists, Numbered lists, या Checklists

टेक्स्ट हाइलाइट

हाइलाइट को टाइटल और टेक्स्ट में वेबसाइट एडिटर के Inline Text सेक्शन का उपयोग करके जोड़ा जा सकता है। हाइलाइट जोड़ने के लिए:

  1. उस टेक्स्ट या टाइटल को सेलेक्ट करें जिसे आप हाइलाइट करना चाहते हैं।

  2. वेबसाइट एडिटर में, Highlight पर क्लिक करें।

  3. हाइलाइट स्टाइल सेलेक्ट करें।

  4. इसका Color संशोधित करें।

  5. इसकी Thickness चुनें।

टेक्स्ट और टाइटल हाइलाइट करें

ऐनिमेशन की सुविधा

एनिमेशन का उपयोग building blocks और वेबसाइट एलिमेंट्स जैसे इमेज और टेक्स्ट में मूवमेंट जोड़ने के लिए किया जाता है। तीन प्रकार के एनिमेशन उपलब्ध हैं: On Scroll, On Appearance, और On Hover (सिर्फ़ इमेज के लिए)।

वेबसाइट एलिमेंट में एनिमेशन जोड़ने के लिए:

  1. एलिमेंट पर क्लिक करें।

  2. वेबसाइट एडिटर में, एलिमेंट के लिए संबंधित सेक्शन में जाएं (जैसे Button, Column, Inline Text, आदि)।

  3. Animation फ़ील्ड में, वांछित एनिमेशन टाइप सेलेक्ट करें।

  4. आवश्यकतानुसार एनिमेशन सेटिंग कस्टमाइज़ करें। उपलब्ध विकल्प चयनित एनिमेशन टाइप के आधार पर भिन्न होते हैं।

स्क्रॉल पर एनिमेशन

स्क्रॉल पर एनिमेशन के लिए, यह संभव है:

  • In चुनें जब एलिमेंट स्क्रीन में प्रवेश करे तो एनिमेशन जोड़ने के लिए और Out जब यह स्क्रीन से बाहर जाए तो इसे जोड़ने के लिए।

  • एक Effect सेलेक्ट करें।

  • इफ़ेक्ट की Direction चुनें।

  • इफ़ेक्ट की Intensity को अनुकूलित करें।

  • Scroll Zone को परिभाषित करें, जहां पहली वैल्यू स्क्रीन के प्रतिशत को दर्शाती है जब इफ़ेक्ट शुरू होता है, और दूसरी वैल्यू अंत में इसके प्रतिशत को दर्शाती है।

दिखने पर एनिमेशन

दिखने पर एनिमेशन के लिए, यह संभव है:

  • विभिन्न प्रभावों में से चुनें।

  • इफ़ेक्ट की Direction चुनें।

  • ट्रिगर विकल्प चुनें ताकि यह परिभाषित किया जा सके कि एनिमेशन कब होता है: या तो पहली बार केवल या हर बार

  • इफ़ेक्ट की Intensity को अनुकूलित करें।

  • अगर आप चाहते हैं कि एनिमेशन कुछ सेकंड के बाद ट्रिगर हो, तो स्टार्ट आफ्टर फ़ील्ड में यह संख्या परिभाषित करें।

  • एनिमेशन के लिए अवधि चुनें।

होवर पर एनिमेशन (सिर्फ़ इमेज के लिए)

होवर पर एनिमेशन इमेज में जोड़े जा सकते हैं। आप एनिमेशन का प्रभाव, साथ ही रंग और स्ट्रोक चौड़ाई चुन सकते हैं।