Computer >> कंप्यूटर >  >> नेटवर्किंग >> इंटरनेट

अपने WordPress सामग्री में कूल CSS3 एनिमेशन कैसे जोड़ें

अपने WordPress सामग्री में कूल CSS3 एनिमेशन कैसे जोड़ें

होमो सेपियन्स के बोलने से बहुत पहले कहानी कहने की कला शुरू हो गई होगी। यह हमारे साथ विकसित होता है और उपलब्ध उपकरणों के अनुकूल होता है। जिन कहानियों को एक पीढ़ी से दूसरी पीढ़ी को सुनाया और पारित किया जाता था, वे मौखिक रूप से हस्तलिखित पुस्तकों से लेकर बड़े पैमाने पर छपाई, डिजिटल वर्ड प्रोसेसिंग और हाल ही में इंटरनेट तक के शाब्दिक विकास को अपनाती हैं। मानव विकास के दृष्टिकोण से ऐसा लगता है कि हमने उन सभी उपलब्ध तकनीकों की पूरी क्षमता का दोहन नहीं किया है जो आज हमारे पास हैं। हालांकि वीडियो ने अपने वर्चुअल वर्ल्ड वर्चस्व अभियान पहले ही शुरू कर दिए हैं, लेकिन वेब की अधिकांश सामग्री अभी भी टेक्स्ट में है।

आधुनिक वेब सामग्री संवादात्मक होनी चाहिए और अच्छे पुराने सादे पाठ के साथ विभिन्न मीडिया को शामिल करना चाहिए। कुछ टूल हमारी कहानी को कुछ हद तक बढ़ाने में हमारी मदद कर सकते हैं। और अगर आप एक वर्डप्रेस उपयोगकर्ता हैं, तो आप इसे चेतन करें! अपनी सामग्री में कूल CSS3 एनिमेशन जोड़ने के लिए प्लगइन।

संभावनाएं क्या हैं?

HTML5 के साथ, CSS3 आधुनिक वेब डिज़ाइन से संबंधित संक्षिप्त नाम है। संक्षेप में, CSS एक वेब घटक है जो उपयोगकर्ताओं को वेब पेज की उपस्थिति को नियंत्रित करने में सक्षम बनाता है जैसे लेआउट, स्थिति, फ़ॉन्ट, रंग, आदि। इसका नवीनतम अवतार, CSS3, उपयोगकर्ताओं को छवियों और एनिमेशन बनाने के लिए पर्याप्त स्मार्ट है कोड।

अपने WordPress सामग्री में कूल CSS3 एनिमेशन कैसे जोड़ें

सौभाग्य से, आपको अपनी वर्डप्रेस साइट पर CSS3 का उपयोग करने के लिए एक कोडर होने की आवश्यकता नहीं है। इसे चेतन करें! प्लगइन आपको संपादक में एक बटन के क्लिक के साथ CSS3 एनिमेशन को पोस्ट, विजेट और पेज पर लागू करने की अनुमति देता है। इसके अलावा, उपयोगकर्ता ट्रिगर्स को नियंत्रित कर सकते हैं। उदाहरण के लिए, वे स्क्रॉल, क्लिक और होवर पर एनीमेशन लागू कर सकते हैं, और अलग-अलग एनीमेशन ब्लॉक पर अलग-अलग स्क्रॉल ऑफ़सेट जोड़ सकते हैं। प्लगइन कई सुविधाओं के साथ भी आता है, जैसे:

  • 50+ एंट्री, एग्जिट और अटेंशन सीकर एनिमेशन
  • एक अच्छा एनिमेशन अनुक्रम बनाने के लिए एनिमेशन में विलंब सुविधा और अवधि नियंत्रण प्रदान करता है
  • उपयोगकर्ताओं को असीमित या किसी निश्चित संख्या में एनिमेशन लागू करने की अनुमति दें
  • कस्टम CSS क्लासेस को अलग-अलग एनिमेशन ब्लॉक में जोड़ने का विकल्प
  • स्मार्टफोन और टैबलेट पर एनिमेशन को सक्षम या अक्षम करने के विकल्प

आप इसे चेतन के साथ क्या कर सकते हैं! लगाना? आप अपने लेखों में सरल अंतःक्रियात्मकताएँ जोड़ सकते हैं, आकर्षक बिक्री पृष्ठ बना सकते हैं, अपनी कल्पनाओं की भावनाओं को गहरा कर सकते हैं, या यदि आप चाहें तो एक शक्तिशाली व्यावसायिक प्रस्तुति भी बना सकते हैं। बस याद रखें कि अति न करें क्योंकि असीमित एनीमेशन के साथ अपने आगंतुक पर बमबारी करना वफादार पाठकों को प्राप्त करने का सबसे अच्छा तरीका नहीं है।

इसे चेतन करना शुरू करना!

प्लगइन को स्थापित और सक्रिय करने के बाद, आप "वर्डप्रेस' संपादक में एनीमेशन जोड़ने के लिए बटन पा सकते हैं।" यह बटन केवल विज़ुअल मोड में दिखाई देगा, लेकिन यदि आपने कमांड्स सीख ली हैं, तो प्लेन टेक्स्ट मोड से कोड डालना संभव है (इस पर बाद में अधिक)।

अपने WordPress सामग्री में कूल CSS3 एनिमेशन कैसे जोड़ें

बटन दबाने के बाद आपको एक विकल्प विंडो मिलेगी। वहाँ तीन टैब हैं जो आपको एनीमेशन को अनुकूलित करने की अनुमति देते हैं। पहला टैब "एंट्री" है। यह एनीमेशन जोड़ने का स्थान है जो कुछ शर्तों पर स्क्रीन में प्रवेश करेगा। चार ड्रॉप-डाउन विकल्प एनिमेशन प्रभावों को समायोजित करने में आपकी सहायता करेंगे।

  • एनीमेशन यह चुनने का स्थान है कि आप किस प्रकार का एनिमेशन चाहते हैं।
  • देरी एनीमेशन शुरू होने से पहले के समय को समायोजित करने में आपकी मदद करेगा।
  • अवधि इस बारे में है कि एनीमेशन को शुरू से अंत तक कितनी देर तक चलाया जाएगा। संख्या जितनी अधिक होगी, एनिमेशन उतना ही धीमा होगा।
  • समय एक बार में चलाने के लिए एनिमेशन का अनुपात है। उदाहरण के लिए, "ईज़ीइन" प्रभाव एनिमेशन को शुरुआत में धीमा और अंत में तेज़ी से चलाएगा।

आप "इसे चेतन करें!" का उपयोग करके प्रभाव संयोजनों को खेलकर देख सकते हैं। बटन। यदि परिणाम आपकी पसंद के अनुसार है, तो आप इसे अपनी सामग्री में उपयोग करने के लिए "सम्मिलित करें" बटन दबा सकते हैं।

अपने WordPress सामग्री में कूल CSS3 एनिमेशन कैसे जोड़ें

"बाहर निकलें" टैब लगभग प्रविष्टि के समान है, लेकिन एक एनीमेशन जोड़ने के लिए जो स्क्रीन को छोड़ देगा। दोनों को मिलाकर, आप एक ऐसी वस्तु जोड़ सकते हैं जो स्क्रीन पर दिखाई देगी और फिर गायब हो जाएगी।

अपने WordPress सामग्री में कूल CSS3 एनिमेशन कैसे जोड़ें

“विकल्प” टैब वह जगह है जहां आप ऐनिमेशन की सामान्य सेटिंग नियंत्रित करते हैं. यहां आप एनीमेशन को लूप या केवल एक बार चलाने के लिए सेट कर सकते हैं, तत्व को अंतिम स्थिति में रख सकते हैं, कस्टम सीएसएस कोड जोड़ सकते हैं, और ट्रिगर सेट कर सकते हैं जो एनीमेशन शुरू करेगा। विशेष रूप से ट्रिगर के बारे में - "एनिमेट ऑन" सेटिंग - आप स्क्रॉल चुन सकते हैं, उदाहरण के लिए, और एनीमेशन केवल तभी शुरू होगा जब क्षेत्र पहले से ही स्क्रीन पर दिखाई दे रहा हो।

अपने WordPress सामग्री में कूल CSS3 एनिमेशन कैसे जोड़ें

अपनी सामग्री जोड़ना

"सम्मिलित करें" बटन दबाने के बाद, आप देखेंगे कि आपके सामग्री क्षेत्र में शॉर्टकोड की कुछ पंक्तियाँ जोड़ी गई हैं। ये शॉर्टकोड वे हैं जो एनीमेशन को नियंत्रित करेंगे। और चूंकि वे केवल मूल्यों के साथ कोड हैं, यदि आप कोड के साथ अच्छे हैं और चाहते हैं तो आप मैन्युअल रूप से कोड जोड़ सकते हैं। हालांकि, अन्य लोगों को केवल इसे चेतन करने के साथ रहना चाहिए! बटन।

आपको टेक्स्ट की एक पंक्ति भी दिखाई देगी जो कहती है, "कृपया इस क्षेत्र में अपनी सामग्री जोड़ें। "यहां वह जगह है जहां आप उन वस्तुओं को जोड़ सकते हैं जिन्हें आप एनिमेट करना चाहते हैं। यह टेक्स्ट, इमेज, आइकन, लोगो, ऑडियो, वीडियो या अन्य शॉर्टकोड भी हो सकता है। मैंने टाइप किए गए जेएस प्लगइन का उपयोग करके उत्पन्न एक टाइप-इफेक्ट शोर्ट जोड़ने की कोशिश की, और परिणाम बहुत अच्छा है।

अपने WordPress सामग्री में कूल CSS3 एनिमेशन कैसे जोड़ें

अगर वहाँ एक बात है कि मैं इसे चेतन करने के बारे में कह सकता हूँ! प्लगइन, यह "प्रयोग!" होगा। इसके साथ खेलें और इच्छित परिणाम प्राप्त करने के लिए विभिन्न संयोजनों का प्रयास करें। मजा आता है। और यहाँ परिणाम है कि मैं एक मिनट से भी कम समय में आया। मैंने इसे एनिमेट किया! टाइप किए गए जेएस प्लगइन के साथ प्लगइन।

अपने WordPress सामग्री में कूल CSS3 एनिमेशन कैसे जोड़ें

क्या आपको लगता है कि यह आपकी वेब सामग्री में सहभागी तत्वों को जोड़ने का समय है? क्या आप प्लगइन को आजमाने की योजना बना रहे हैं? क्या आप एनिमेशन के लिए विभिन्न प्लगइन्स का उपयोग करते हैं? कृपया नीचे दी गई टिप्पणियों का उपयोग करके साझा करें।


  1. इन वर्डप्रेस प्लगइन्स को जोड़ें और अपनी साइट पर अधिक ट्रैफिक प्राप्त करें

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

  1. अपने मैक में प्रिंटर कैसे जोड़ें?

    यदि आपको एक नया प्रिंटर मिला है और आप कुछ दस्तावेज़ों को प्रिंट करने की तैयारी कर रहे हैं, तो आपको इसे पहले अपने मैक में जोड़ना चाहिए। लेकिन मैक में प्रिंटर जोड़ना कोई आसान बात नहीं है। चिंता मत करो। निम्नलिखित निर्देश आपको विस्तार से बताएंगे कि वाई-फाई, ब्लूटूथ, आईपी एड्रेस या यूएसबी के माध्यम से

  1. अपने WordPress डेटाबेस को कैसे साफ करें

    क्या आप एक तेज़ वर्डप्रेस वेबसाइट चाहते हैं? यदि ऐसा है, तो आपको अनावश्यक डेटा को हटाकर वर्डप्रेस डेटाबेस को साफ करना होगा। वर्डप्रेस डेटाबेस क्लीनअप एक महत्वपूर्ण रखरखाव कार्य है जो आपकी वेबसाइट पर पृष्ठ लोडिंग समय को कम करेगा। इसे अन्य प्रदर्शन तकनीकों जैसे कैशिंग पृष्ठों, छवियों को अनुकूलित करने