गतिशील टेबल विजेट सेटिंग्स

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

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

डायनामिक टेबल विजेट क्या करता है #

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

इसमें तीन टैब हैं: हेडर, बॉडी और सेटिंग्स के लिए सामग्री, रंगों और रिक्ति के लिए शैली, और सामान्य एलिमेंटर विकल्पों के लिए उन्नत परिणाम एक साफ, उत्तरदायी तालिका है जो आपके विषय से मेल खाती है।

इससे पहले कि आप शुरू करें #

• वर्डप्रेस साथ तत्व स्थापित और सक्रिय।
• एलिमेंट के लिए मास्टर ऐडऑन स्थापित और सक्रिय प्लगइन के लिए नया? देखना स्थापना गाइड.
• डेटा जिसे आप दिखाना चाहते हैं, कॉलम और पंक्तियों के रूप में स्केच किया गया है।

डायनामिक टेबल विजेट कैसे जोड़ें #

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

तालिका शीर्षलेख सेट करें #

को खोलें सामग्री टैब। द टेबल हेड अनुभाग हेडर पंक्ति रखता है। द टेबल हेड टॉगल हेडर दिखाता है या छुपाता है, और टेबल हैडर सेल पुनरावर्तक प्रति कॉलम एक आइटम रखता है।

प्रत्येक हेडर सेल की अपनी सामग्री और विकल्प उप-टैब होते हैं। में सामग्री आपने सेट किया कॉलम नाम और एक जोड़ सकते हैं चिह्न या एक छवि इसके बगल में (प्रकार: कोई नहीं, चिह्न या छवि) उपयोग करें आइटम जोड़ें कॉलम जोड़ने के लिए, कॉपी आइकन को डुप्लिकेट करने के लिए, और एक्स को हटाने के लिए।

टेबल बॉडी भरें #

द टेबल बॉडी अनुभाग कोशिकाओं को रखता है प्रत्येक आइटम एक सेल है, और एक नई पंक्ति? उन चिह्नों को टॉगल करें जहां एक नई पंक्ति शुरू होती है, इसलिए आप क्रम में सेल जोड़ते हैं और प्रत्येक पंक्ति की शुरुआत को चिह्नित करते हैं।

प्रत्येक बॉडी सेल में सामग्री और विकल्प उप-टैब भी होते हैंः

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

तालिका विकसित करने के लिए, क्लिक करें आइटम जोड़ें, सेल टेक्स्ट टाइप करें और चालू करें नई पंक्ति? प्रत्येक नई लाइन के पहले सेल पर यहां पांचवीं कर्मचारी पंक्ति जोड़ी जा रही है।

तालिका को उत्तरदायी बनाएं #

द सेटिंग्स अनुभाग में एक है उत्तरदायी तालिका? टॉगल करें इसके साथ, टेबल ओवरफ्लो होने के बजाय छोटी स्क्रीन पर फिर से बहती है, इसलिए प्रत्येक पंक्ति ७६८ पीएक्स वाइड तक के उपकरणों पर एक पठनीय कार्ड में ढेर हो जाती है, जिसमें कॉलम नाम को लेबल के रूप में दिखाया जाता है, यह सेटिंग लोग भूल जाते हैं, और यही कारण है कि मोबाइल पर एक टेबल टूटी हुई दिखती है।

तालिका को स्टाइल करें #

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

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

हेडर और बॉडी स्टाइलिंग #

द टेबल हेडर स्टाइल अनुभाग हेडर की पृष्ठभूमि, पाठ रंग, टाइपोग्राफी और पैडिंग सेट करता है ताकि शीर्ष पंक्ति अलग हो जाए। द टेबल बॉडी अनुभाग डेटा कोशिकाओं के लिए भी ऐसा ही करता है।

• पृष्ठभूमि रंग और पाठ रंगः शरीर की कोशिकाओं के रंग।
• चिह्न आकार, चिह्न रंग, और चिह्न पैडिंगः किसी भी सेल आइकन के लिए स्टाइलिंग।
• संरेखण और टाइपोग्राफीः बॉडी टेक्स्ट कैसे बैठता है और दिखता है।

पेज पर रिजल्ट #

प्रकाशित करें या पूर्वावलोकन करें और तालिका आपके कॉलम, पंक्तियों और जगह में स्ट्रिपिंग के साथ प्रस्तुत करती है, यदि आपने इसे चालू किया है तो मोबाइल पर उत्तरदायी है।

सामान्य उपयोग के मामले #

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

डायनामिक टेबल विजेट के साथ काम करने के लिए युक्तियाँ #

• पहले कॉलम की योजना बनाएं. बॉडी भरने से पहले प्रत्येक हेडर सेल को सेट करें ताकि पंक्तियाँ पंक्तिबद्ध हो जाएँ।
• केवल पहले सेल पर नई पंक्ति चिह्नित करें। प्रत्येक पंक्ति की शुरुआत को ध्वजांकित करें, प्रत्येक सेल को नहीं, या लेआउट टूट जाता है।
• फोन के लिए उत्तरदायी तालिका चालू करें। जब तक यह चालू न हो, वाइड टेबल मोबाइल पर ओवरफ्लो हो जाती हैं।
• लंबी तालिकाओं के लिए स्ट्रिपिंग का उपयोग करें। ज़ेबरा पंक्तियाँ एक लंबी डेटा तालिका को स्कैन करना बहुत आसान बनाती हैं।
• सेल टेक्स्ट को छोटा रखें। लंबी तारें एक स्तंभ को खींचती हैं, इसलिए चीजों को समान रखने के लिए कस्टम चौड़ाई का उपयोग करें।

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

लपेटकर #

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