कुंजी तकिए
- एलिमेंटर और एलिमेंटर प्रो में कोई टाइमलाइन विजेट नहीं है, इसलिए एलिमेंटर क्षैतिज टाइमलाइन के लिए एक ऐडऑन विजेट या कस्टम सीएसएस के साथ कंटेनरों की हाथ से निर्मित पंक्ति की आवश्यकता होती है।
- मास्टर ऐडऑन टाइमलाइन विजेट टाइमलाइन अनुभाग के अंतर्गत सामग्री टैब में पाए जाने वाले एक नियंत्रण, टाइमलाइन शैली के साथ ऊर्ध्वाधर से क्षैतिज पर स्विच करता है।
- मास्टर एडॉन्स विजेट में एक क्षैतिज समयरेखा एक हिंडोला है, और इसका नेविगेशन नियंत्रण छह विकल्प प्रदान करता है: तीर और बिंदु, तीर और अंश, तीर, बिंदु, प्रगति और कोई नहीं।
- टाइमलाइन विजेट में कैरोसेल सेटिंग्स में कैरोसेल या कवरफ्लो लेआउट, 5000 एमएस की डिफ़ॉल्ट गति के साथ ऑटोप्ले, होवर पर रोकें, स्क्रॉल करने के लिए स्लाइड, सेंटर स्लाइड और लूप शामिल हैं।
- क्षैतिज लेआउट केवल कस्टम टाइमलाइन आइटम के साथ काम करता है, क्योंकि ब्लॉग पोस्ट से निर्मित पोस्ट टाइमलाइन लंबवत रहती है।
एक एलिमेंटर क्षैतिज समयरेखा आपकी तिथियों को बाएं से दाएं बताती है, प्रत्येक कार्ड के ऊपर की रेखा पर एक बिंदु और उसके साथ चलने के लिए तीर होते हैं। तत्व इसका अपना कोई टाइमलाइन विजेट नहीं है, इसलिए यह गाइड इसका उपयोग करता है मास्टर ऐडऑन में टाइमलाइन विजेट, जहां क्षैतिज लेआउट एक एकल ड्रॉपडाउन है।
नीचे दिए गए छह चरण एक साधारण ऊर्ध्वाधर समयरेखा से शुरू होते हैं और एक काम कर रहे हिंडोला के साथ समाप्त होते हैं प्रत्येक स्क्रीनशॉट एक परीक्षण पृष्ठ पर विजेट के साथ एलिमेंटर ४.३ से आता है यदि आपने अभी तक एक समयरेखा नहीं रखी है, तो पूर्ण समयरेखा ट्यूटोरियल पहले मूल बातें शामिल करता है।
विषय-सूची
जब एक क्षैतिज समयरेखा बेहतर विकल्प है
एक क्षैतिज समयरेखा का उपयोग करें जब आपके पास चरणों का एक छोटा रन और सीमित ऊर्ध्वाधर स्थान है तीन कार्डों के साथ एक ऊर्ध्वाधर समयरेखा स्क्रॉलिंग की एक पूर्ण स्क्रीन से अधिक ले सकती है वही तीन कार्ड एक पंक्ति में साइड फिट होते हैं, यही कारण है कि क्षैतिज लेआउट होम पेज और लैंडिंग पृष्ठों पर दिखाई देते हैं, जबकि ऊर्ध्वाधर वाले लंबे पृष्ठों के बारे में।
| कारक | क्षैतिज समयरेखा | लंबवत समयरेखा |
|---|---|---|
| सबसे अच्छी लंबाई | 3 से 8 आइटम | कोई लंबाई |
| अंतरिक्ष यह जरूरत है | एक पंक्ति | हर सामान के साथ बढ़ता है |
| आगंतुक कैसे चलते हैं | तीर, बिंदु या स्वाइप | पृष्ठ स्क्रॉल करना |
| विशिष्ट उपयोग | प्रक्रिया चरण, उत्पाद रोडमैप, वार्षिक हाइलाइट्स | कंपनी का इतिहास, चेंजलॉग, लंबी कहानी |
| मास्टर ऐडऑन में स्रोत | कस्टम टाइमलाइन आइटम | कस्टम आइटम या ब्लॉग पोस्ट |
एक क्षैतिज समयरेखा एक प्रकार का हिंडोला है यदि आप अनिश्चित हैं कि दो शब्दों में से कौन सा आपके डिजाइन को फिट करता है, तो एलिमेंटर में हिंडोला बनाम स्लाइडर अंतर बताते हैं।
एलिमेंटर में क्षैतिज समयरेखा कैसे बनाएं
आपको एलिमेंटर और मास्टर एडॉन्स स्थापित करने की आवश्यकता है, फिर संपादक में छह चरण नीचे कुछ भी कस्टम सीएसएस की आवश्यकता नहीं है।
चरण १: टाइमलाइन विजेट जोड़ें
एलिमेंटर के साथ अपना पेज खोलें, विजेट पैनल खोजें समयरेखा और इसे पृष्ठ पर खींचें यह तीन नमूना वस्तुओं के साथ एक ऊर्ध्वाधर समयरेखा के रूप में आता है छोड़ दें समयरेखा प्रकार पर कस्टम टाइमलाइन, क्योंकि क्षैतिज लेआउट केवल कस्टम आइटम के लिए पेश किया जाता है।
चरण २: टाइमलाइन शैली को क्षैतिज पर स्विच करें
सामग्री टैब में, खोलें समयरेखा अनुभाग और परिवर्तन समयरेखा शैली वर्टिकल टाइमलाइन से लेकर क्षैतिज समयरेखाकार्ड एक पंक्ति में चलते हैं, लाइन शीर्ष पर चलती है, और प्रत्येक बिंदु अपने कार्ड के ऊपर बैठता है इसके ऊपर की तारीख के साथ पैनल में दो नए खंड दिखाई देते हैं: नेविगेशन और हिंडोला सेटिंग्स।
चरण ३: आइटम संपादित करें
नीचे एक पंक्ति पर क्लिक करें आइटम इसे खोलने के लिए प्रत्येक आइटम में तीन छोटे टैब होते हैं: सामग्री, मीडिया और शैली।
- शो तय करता है कि बिंदु से ऊपर क्या बैठता है: एक तिथि या एक कस्टम लेबल जैसे कि “चरण 1”।
- तारीख और दिनांक प्रारूप तिथि निर्धारित करें और यह कैसे लिखा जाता है।
- लिंक पूरे कार्ड को क्लिक करने योग्य बनाता है।
- सामग्री संपादक शीर्षक और विवरण रखता है कोई अलग शीर्षक क्षेत्र नहीं है, इसलिए पहली पंक्ति शीर्षक है।
- द मीडिया टैब कार्ड में एक छवि जोड़ता है।
वाइड छवियां यहां लंबे लोगों की तुलना में बेहतर काम करती हैं तीन लंबी तस्वीरें स्क्रीन के नीचे पाठ को दूर तक धक्का देती हैं।
चरण ४: नेविगेशन चुनें
को खोलें नेविगेशन अनुभाग और चुनें कि विज़िटर टाइमलाइन के माध्यम से कैसे आगे बढ़ते हैं। नेविगेशन ड्रॉपडाउन में छह विकल्प हैं।
| नेविगेशन विकल्प | आगंतुक क्या देखते हैं | लिए अच्छा |
|---|---|---|
| तीर और बिंदु | पिछला और अगला तीर और प्रति स्लाइड एक बिंदु | अधिकांश समयसीमा |
| तीर और अंश | तीर और एक काउंटर जैसे 2/6 | लंबी समयसीमा जहां बिंदुओं पर भीड़ हो जाती है |
| तीर | तीर ही | साफ लेआउट |
| डॉट्स | केवल डॉट्स | टच-फर्स्ट डिज़ाइन |
| प्रगति | एक बार जो हिंडोला के आगे बढ़ने पर भर जाता है | प्रक्रिया कदम |
| कोई नहीं | स्वाइप या ऑटोप्ले केवल | सजावटी स्ट्रिप्स |
ड्रॉपडाउन के नीचे आप चालू कर सकते हैं गतिशील गोलियाँ?, के साथ एक स्क्रॉलबार जोड़ें स्क्रॉलबार दिखाएँ?, स्थिति सेट करें, और अगले और पिछले आइकन स्वैप करें। मोबाइल पर तीर छुपाएं? डिफ़ॉल्ट रूप से चालू है, जो फोन आगंतुकों को स्वाइप और डॉट्स के साथ छोड़ देता है।
चरण 5: हिंडोला व्यवहार सेट करें
खुला हिंडोला सेटिंग्स यह नियंत्रित करने के लिए कि समयरेखा कैसे चलती है।
- लेआउट: एक फ्लैट पंक्ति के लिए हिंडोला, या ३ डी प्रभाव के लिए कवरफ्लो घुमाएं, खिंचाव और गहराई नियंत्रण के साथ।
- ऑटोप्ले और ऑटोप्ले स्पीड: डिफ़ॉल्ट गति 5000 एमएस है, इसलिए हर पांच सेकंड में एक नई स्लाइड।
- होवर पर विराम: पॉइंटर टाइमलाइन पर होने पर ऑटोप्ले बंद हो जाता है।
- स्क्रॉल करने के लिए स्लाइड: प्रति क्लिक कितने कार्ड चलते हैं, प्रति डिवाइस सेट करें।
- केंद्र स्लाइड, कर्सर पकड़ो और खींचें फ्री मोड ड्रैग के एहसास के लिए।
- लूप: अंतिम आइटम के बाद पहले आइटम पर लौटता है।
- एनिमेशन स्पीड (एमएस): प्रत्येक स्लाइड संक्रमण में कितना समय लगता है, डिफ़ॉल्ट रूप से 500।
एक वास्तविक समयरेखा के लिए, ऑटोप्ले के बारे में दो बार सोचें तारीखों का एक आदेश है, और एक कार्ड जो किसी को पढ़ने के दौरान दूर स्लाइड करता है, यह कष्टप्रद है होवर पर विराम के साथ ऑटोप्ले एक उचित मध्य मैदान है।
चरण ६: तीर, अंक और कार्ड को स्टाइल करें
स्टाइल टैब पर स्विच करें इसमें दस खंड हैं: हिंडोला आइटम, लेआउट, छवियां, पोस्ट, कार्ड, तीर, तिथियां, रेखा, अंक और नेविगेशन।
- कार्ड: पैडिंग, बॉर्डर त्रिज्या, शीर्षक और सामग्री रंग, साथ ही केंद्रित कार्ड के लिए एक अलग लुक।
- खजूर: प्रत्येक बिंदु के ऊपर की तारीख या लेबल की टाइपोग्राफी और रंग।
- लाइन: ट्रैक का रंग और मोटाई।
- पॉइंट्स: आकार और रंगों के साथ एक सादा बिंदु, एक आइकन या एक छवि।
- नेविगेशन: तीर, बिंदु और स्क्रॉलबार के लिए रंग और आकार।
पृष्ठ प्रकाशित करें और इसे फोन पर परीक्षण करें छोटी स्क्रीन पर प्रति पंक्ति ड्रॉप कार्ड, इसलिए जांचें कि पाठ अभी भी फिट बैठता है।
ऊर्ध्वाधर लेआउट के रूप में अच्छी तरह से चाहते हैं? द एलिमेंटर टाइमलाइन विजेट पृष्ठ प्रत्येक लेआउट, संरेखण और शैली विकल्प को एक ही स्थान पर सूचीबद्ध करता है।
वीडियो ट्यूटोरियल
यह वीडियो एक खाली पृष्ठ से एक समयरेखा बनाता है और इसे 3:44 पर क्षैतिज हिंडोला में बदल देता है।
चार चीजें जो गलत हो जाती हैं
क्षैतिज समयरेखा के साथ अधिकांश समस्याएं इसे ऊर्ध्वाधर समयरेखा की तरह मानने से आती हैं।
- बहुत अधिक आइटम। पिछले आठ या तो, आगंतुक क्लिक करना बंद कर देते हैं एक ऊर्ध्वाधर समयरेखा का उपयोग करें या कहानी को वर्ष से विभाजित करें।
- असमान कार्ड ऊंचाई। एक लंबा विवरण पंक्ति को फैलाता है पाठ को ट्रिम करें या कैरोसेल सेटिंग्स में ऑटो ऊंचाई चालू करें।
- पहले कार्ड पर तीर। यदि तीर सामग्री के शीर्ष पर बैठते हैं, तो नेविगेशन अनुभाग में स्थिति बदलें।
- ब्लॉग पोस्ट की अपेक्षा। पोस्ट टाइमलाइन प्रकार लंबवत है एक पंक्ति में पोस्ट के लिए, का उपयोग करें ब्लॉग विजेट हिंडोला मोड में।
यह भी पढ़ेः 20 एलिमेंटर स्लाइडर टेम्प्लेटहै, जिसमें एक टाइमलाइन स्लाइडर डिज़ाइन शामिल है।
अक्सर पूछे जाने वाले प्रश्न
क्या मैं एलिमेंट प्रो के बिना एलिमेंट में एक क्षैतिज समयरेखा बना सकता हूं?
हाँ। एलिमेंटर प्रो में टाइमलाइन विजेट भी शामिल नहीं है, इसलिए प्रो से यहां कोई फर्क नहीं पड़ता है। मास्टर ऐडऑन जैसे ऐडऑन से टाइमलाइन विजेट जोड़ें, टाइमलाइन स्टाइल को क्षैतिज टाइमलाइन पर सेट करें, और आइटम हिंडोला बन जाते हैं।
मैं एलिमेंट में क्षैतिज समयरेखा में तीर कैसे जोड़ूं?
सामग्री टैब में नेविगेशन अनुभाग खोलें और तीर और डॉट्स, तीर और अंश, या तीर चुनें फिर आप तीर की स्थिति सेट कर सकते हैं और उसी अनुभाग से अगले और पिछले आइकन बदल सकते हैं।
क्या क्षैतिज समयरेखा ऑटोप्ले हो सकती है?
हाँ कैरोसेल सेटिंग्स के तहत ऑटोप्ले चालू करें और मिलीसेकंड में ऑटोप्ले स्पीड सेट करें डिफ़ॉल्ट ५००० है, जो प्रति स्लाइड पांच सेकंड है होवर पर विराम इसे रोकता है जबकि एक आगंतुक पढ़ रहा है।
क्या क्षैतिज समयरेखा उत्तरदायी है?
हाँ। यह एक हिंडोला है, इसलिए यह टैबलेट और फोन पर कम कार्ड दिखाता है और आगंतुक स्थानांतरित होने के लिए स्वाइप करते हैं। स्क्रॉल पर स्लाइड में प्रति डिवाइस अलग-अलग मान होते हैं।
क्या मैं ब्लॉग पोस्ट को क्षैतिज समयरेखा में दिखा सकता हूँ?
पोस्ट टाइमलाइन प्रकार के साथ नहीं, जो केवल लंबवत है कस्टम टाइमलाइन आइटम के रूप में हाथ से पोस्ट जोड़ें, या पोस्ट हिंडोला का उपयोग करें।
अंतिम विचार
एक एलिमेंटर क्षैतिज समयरेखा एक सेटिंग और दो खंडों में नीचे आती है: टाइमलाइन शैली क्षैतिज समयरेखा पर सेट होती है, फिर इसके छह विकल्पों के साथ नेविगेशन और ऑटोप्ले, लूप और गति के लिए हिंडोला सेटिंग्स इसे तीन से आठ छोटे कार्ड में रखें और इसे एक फोन पर परीक्षण करें।
द समयरेखा विजेट पृष्ठ इसमें दोनों लेआउट का लाइव डेमो है, जिसमें ए भी शामिल है क्षैतिज रोडमैप डेमो.
संबंधित पढ़ने
2 प्रतिक्रियाएँ
बिंदु यह है कि क्षैतिज लेआउट केवल कस्टम टाइमलाइन आइटम के साथ काम करता है, पोस्ट टाइमलाइन नहीं, याद करना आसान है और देर से एक निर्माण को तोड़ देगा टाइमलाइन शैली स्विच करने से पहले, पुष्टि करें कि प्रत्येक आइटम एक कस्टम है, क्योंकि ब्लॉग-पोस्ट-संचालित टाइमलाइन लंबवत रहती है एक व्यावहारिक ट्वीक: एरो और डॉट्स पर नेविगेशन सेट करें, फिर एक संकीर्ण फोन चौड़ाई पर परीक्षण करें, क्योंकि हिंडोला तीर कार्ड को भीड़ सकते हैं और डॉट्स पाठकों के लिए स्वाइपिंग को स्पष्ट बनाते हैं।
इन उपयोगी युक्तियों को साझा करने के लिए धन्यवाद! 😊 आप बिल्कुल सही हैं कि टाइमलाइन आइटम प्रकार की जांच करना और छोटी स्क्रीन पर लेआउट का परीक्षण करना अप्रत्याशित मुद्दों से बचने में मदद कर सकता है हम आपको इस ओर इशारा करते हुए और अन्य मास्टर एडॉन्स उपयोगकर्ताओं को बेहतर, अधिक उत्तरदायी टाइमलाइन बनाने में मदद करने के लिए धन्यवाद हमारे समुदाय का हिस्सा!