एलिमेंटर (कोर, नेस्टेड और ऐडऑन) में टैब कैसे बनाएं

आइकन शीर्षक और पहला पैनल खुला के साथ चार एलिमेंटर टैब

कुंजी तकिए

  • एलिमेंटर के पास दो टैब विजेट हैं मूल एक ने संस्करण ३.८ के बाद से एक मूल्यह्रास नोटिस किया है, और नेस्टेड टैब्स विजेट ने इसे बदल दिया है।
  • नेस्टेड टैब्स प्रत्येक पैनल में एक कंटेनर रखता है, इसलिए एक फॉर्म, एक गैलरी या मूल्य निर्धारण तालिका एक टैब के अंदर रह सकती है।
  • नेस्टेड टैब्स आपके द्वारा चुने गए ब्रेकप्वाइंट के नीचे एक वर्टिकल अकॉर्डियन लेआउट पर भी स्विच करता है, जो कि ज्यादातर लोग फोन पर यही व्यवहार चाहते हैं।
  • एक ऐडऑन विजेट जैसे कि मास्टर ऐडऑन टैब्स विजेट वह मार्ग है जब टैब स्ट्रिप स्वयं डिज़ाइन समस्या है: छवि शीर्षक, शैली प्रीसेट या होवर पर स्विच करना।
  • पैनल के अंदर क्या जाता है उसके द्वारा चुनें अंदर विजेट का मतलब कोर है टेक्स्ट पर एक स्टाइल टैब स्ट्रिप का मतलब एक ऐडऑन है।

टैब एक काम करते हैं: एक लंबा पृष्ठ छोटा रखें विशिष्टता, वितरण और वारंटी सभी को एक बार स्क्रीन पर होने की आवश्यकता नहीं है, और एक आगंतुक जो उनमें से एक चाहता है उसे अन्य दो से आगे स्क्रॉल नहीं करना चाहिए।

एलिमेंटर आपको इसके लिए दो विजेट देता है और ऐडऑन आपको अधिक देता है, यही कारण है कि “tabs” के लिए पैनल खोज भ्रमित करने वाली है। यह गाइड तीनों मार्गों को कवर करता है, प्रत्येक को क्या पकड़ सकता है, और वे फोन पर कैसे व्यवहार करते हैं।

आपके पास वास्तव में कौन सा टैब विजेट है

विजेट पैनल खोलें और टैब खोजें एक वर्तमान एलिमेंटर इंस्टॉल पर आपको टैब विजेट मिलता है, और आप जो खींचते हैं वह नेस्टेड संस्करण है पुराना विजेट अभी भी उन पृष्ठों के लिए कोड में है जो पहले से ही इसका उपयोग करते हैं, और यह पैनल में एक नोटिस दिखाता है जब आप एक संपादित करते हैं: कोई भी नया टैब विजेट जिसे आप खींचते हैं वह नेस्टेड क्षमताओं के साथ नया होगा वह नोटिस एलिमेंटर ३.८ के बाद से है।

तो व्यवहार में तीन चीजें हैं जिनका आप उपयोग कर रहे होंगे, और वे समान नहीं हैं।

विजेटएक पैनल में क्या जाता हैजहां से आती है
टैब (नेस्टेड)एक कंटेनर, इसलिए कोई विजेटएलिमेंटर, मुफ़्त
टैब (पुराना)केवल संपादक सामग्रीएलिमेंटर, 3.8 से बहिष्कृत
टैब विजेट जोड़ेंसंपादक सामग्री, या प्रो के साथ सहेजा गया टेम्पलेटमास्टर एडॉन्स और अन्य

रूट 1: नेस्टेड टैब्स विजेट

यह डिफ़ॉल्ट और सही प्रारंभिक बिंदु है पृष्ठ पर टैब खींचें और आपको तीन टैब मिलते हैं, प्रत्येक एक खाली कंटेनर पकड़े हुए।

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

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

रूट 2: एक ऐडऑन टैब विजेट

समस्या के दूसरे आधे हिस्से के लिए एडऑन विजेट मौजूद हैं, जहां पट्टी डिजाइन है मास्टर एडॉन्स विजेट प्रत्येक टैब को एक पुनरावर्तक पंक्ति से बनाता है जो अपने स्वयं के क्षेत्रों को वहन करता है।

स्टाइल प्रीसेट नियंत्रण और टैब पुनरावर्तक के साथ मास्टर ऐडऑन टैब विजेट पैनल
स्टाइल प्रीसेट शीर्ष पर बैठता है: क्षैतिज टैब, ऊर्ध्वाधर टैब या बाएं सक्रिय बॉर्डर।
एक खुला टैब आइटम जो आइकन प्रकार को किसी के साथ नहीं, आइकन और छवि, टैब शीर्षक फ़ील्ड और सामग्री प्रकार ड्रॉपडाउन दिखाता है
प्रति टैब: आइकन प्रकार (कोई नहीं, आइकन या छवि), शीर्षक और सामग्री प्रकार।

निर्माण हैः

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

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

रूट 3: पुराना टैब्स विजेट

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

इसके साथ एक नया पृष्ठ शुरू करने का कोई कारण नहीं है यदि आप पहले से ही वहां हैं, तो सवाल यह है कि क्या नेस्टेड टैब्स के रूप में ब्लॉक का पुनर्निर्माण कुछ मिनटों के लायक है, और आमतौर पर यह है, क्योंकि आपको अकॉर्डियन ब्रेकपॉइंट और कंटेनर मिलता है।

कौन सा मार्ग नौकरी के लिए उपयुक्त है

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

सही होने लायक पांच बातें

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

अक्सर पूछे जाने वाले प्रश्न

क्या एलिमेंटर के पास मुफ्त संस्करण में टैब विजेट है?

हाँ। टैब्स विजेट मुफ़्त प्लगइन में है, और वर्तमान संस्करण नेस्टेड है, जो प्रत्येक पैनल के अंदर एक कंटेनर रखता है।

पुराने टैब्स विजेट का क्या हुआ?

यह बहिष्कृत है चूंकि एलिमेंटर ३.८ पैनल एक नोटिस दिखाता है जब आप एक संपादित करते हैं, और कोई भी नया टैब विजेट जिसे आप खींचते हैं वह नेस्टेड संस्करण है।

क्या मैं टैब के अंदर एक फॉर्म या गैलरी डाल सकता हूं?

नेस्टेड टैब के साथ, हाँ, क्योंकि प्रत्येक पैनल एक कंटेनर है एक ऐडऑन विजेट के साथ पैनल संपादक सामग्री लेता है, इसलिए समकक्ष प्रो पर एक सहेजा गया टेम्पलेट है।

क्या टैब शीर्षक पाठ के बजाय छवि का उपयोग कर सकता है?

कोर विजेट में नहीं आइकन प्रकार नियंत्रण के साथ ऐडऑन विजेट शीर्षक पर एक आइकन या एक छवि का उपयोग कर सकते हैं।

कितने टैब बहुत अधिक हैं?

पिछले चार या पांच, स्ट्रिप लैपटॉप पर लपेटता है और फोन पर अपठनीय हो जाता है उस बिंदु पर एक अकॉर्डियन आमतौर पर बेहतर लेआउट होता है।

अंतिम विचार

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

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

एक उत्तर छोड़ें

आपका ईमेल पता प्रकाशित नहीं किया जाएगा। आवश्यक फ़ील्ड चिह्नित हैं *