मुख्य सामग्री पर जाएं

WP Table Manager: टेबल को स्टाइल करना

1. प्रारूप

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

 

शैली-तालिका

 

आप टेबल एडिटर के लिए प्रतिशत का चयन कर सकते हैं। इसका मतलब है कि आप अपनी टेबल को 50% से 200% तक ज़ूम इन/आउट कर सकते हैं।.

 

ज़ूम-इन-आउट

 

पंक्ति की ऊँचाई और स्तंभ की चौड़ाई पिक्सेल में निर्धारित की जा सकती है। कृपया मेनू फॉर्मेट > कॉलम/पंक्ति का आकार लागू करें पर जाएं , फिर कॉलम का आकार बदलें / पंक्ति का आकार बदलें चुनें। पॉप-अप विंडो में, आप सीमा का चयन कर सकते हैं और स्तंभों या पंक्तियों के लिए पिक्सेल मान निर्धारित कर सकते हैं। पूरा करने के लिए 'हो गया' बटन पर क्लिक करें ।

 

कॉलम का आकार बदलें

 

2. विषय और विकल्प

प्रत्येक टेबल में, मेनू थीम  में आपको थीम चयन का विकल्प मिलेगा । थीम लागू करने के लिए बस उस पर क्लिक करें।

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

 

विषय-चयन

वैकल्पिक रंग

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

 

थीम-रंग बदलें

 

आप राइट-क्लिक मेनू में "हटाएँ > स्वचालित स्टाइलिंग हटाएँ" विकल्प पर क्लिक करके वैकल्पिक रंग को हटा सकते हैं । आपकी पुष्टि के बाद रंग हट जाएगा। 

 

वैकल्पिक रंग हटाएँ

 

टेबल अलाइन

टेबल अलाइनमेंट का उपयोग टेबल को समाहित करने वाले div को संरेखित करने के लिए किया जाता है, उदाहरण के लिए पूरी टेबल को केंद्र में लाना। आप इसे मेनू फॉर्मेट > टेबल अलाइनमेंट

 

टेबल-अलाइन

सेल हाइलाइटिंग

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

 

टेबल-हाइलाइट

 

3. सेल पर टूलटिप जोड़ें

टेबल के प्रत्येक सेल पर राइट क्लिक करने पर आपको ऐड टूलटिप का विकल्प दिखाई देगा।.

 

ऐड-टूलटिप

 

आप टूलटिप की चौड़ाई पिक्सल में सेट कर सकते हैं। ऐसा करने पर आपको संपादन के लिए एक संपादक वाला टूलटिप दिखाई देगा।.

 

टूलटिप-संपादक

 

सामग्री जोड़ें और सहेजें, बस हो गया। माउस को होवर करने पर टूलटिप सार्वजनिक पृष्ठ पर प्रदर्शित होगा।.

 

टूलटिप-होवर

 

4. पंक्ति और स्तंभ को स्थिर करना

स्तंभ जमना

कॉलम फ्रीज़ करने का विकल्प मेनू फॉर्मेट > रिस्पॉन्सिव ऑप्शंस। आप अधिकतम 5 कॉलम फ्रीज़ कर सकते हैं। गिनती पहले कॉलम से शुरू होती है।

 

फ्रीज-कॉलम

 

कॉलम/पंक्ति को स्थिर करने के लिए एक अतिरिक्त विकल्प है जो आपको टेबल की ऊंचाई तय करने की सुविधा देता है (क्योंकि आपके टेबल कंटेनर की ऊंचाई अनंत हो सकती है)।.

 

टेबल की ऊंचाई

 

जब आप फ्रीज करने के लिए कॉलम का चयन कर लेते हैं, तो आप अपनी टेबल पर स्क्रॉल कर पाएंगे और हमेशा स्थिर कॉलम प्रदर्शित होगा।.

 

फिक्स-लाइन-डिस्प्लेइंग

 

पंक्ति जमना

आप इसे मेनू फॉर्मेट > टेबल हेडर, यहाँ से आप विकल्प को चालू कर सकते हैं और पंक्तियों को फ्रीज करने के लिए सेट कर सकते हैं (अधिकतम 5 पंक्तियाँ)।

 

पंक्ति-फ्रीज़-टेबल-हेडर

 

यदि आप टेबल की ऊंचाई निर्धारित करना चाहते हैं, तो कृपया रिस्पॉन्सिव विकल्पों पर वापस जाएं।

इसके बाद सेटिंग के अनुसार फ्रंटएंड पर पहली पंक्ति स्थिर हो जाएगी।.

 

पंक्ति-फ्रीज़

 

5. क्रमबद्ध करें और फ़िल्टर करें

यदि आप अपनी तालिका को सॉर्ट या फ़िल्टर करना चाहते हैं, तो कृपया मेनू फ़ॉर्मेट > सॉर्ट और फ़िल्टर विकल्प पर जाएं।

 

सॉर्ट-फ़िल्टर

 

इसके बाद सॉर्ट और फ़िल्टर विकल्पों वाला एक पॉपअप दिखाई देता है।. 

 

फ़िल्टर-सॉर्ट-पॉपअप

 

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

उदाहरण के लिए, इस मामले में, ASC दिशा के साथ कॉलम A का चयन करें।

 

सॉर्ट-विकल्प

 

फ़िल्टर के लिए 2 विकल्प हैं:

 

फ़िल्टर-विकल्प

 

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

 

फ़िल्टर-इनसाइड-कॉलम

 

  • उन्नत फ़िल्टर फ़ॉर्म: विकल्प चुने जाने के बाद, आप तालिका में डेटा खोज और फ़िल्टर कर सकते हैं।

 

आधुनिक फ़िल्टर

 

मुख्य खोज: इस सुविधा को सक्षम करने पर, फ्रंटएंड पर एक खोज इनपुट फ़ील्ड जुड़ जाएगा। इससे उपयोगकर्ता तालिका में मौजूद सभी डेटा को आसानी से खोज सकेंगे।

 

मुख्य-खोज

 

6. सेल पैडिंग और बॉर्डर-त्रिज्या

आप टूलबार पर बॉर्डर आइकन पा सकते हैं जो सेल पर पैडिंग और बॉर्डर त्रिज्या को समायोजित करने में मदद करता है।.

 

पैडिंग-बॉर्डर

 

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

 

7. कस्टम सीएसएस

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

 

format-custom-css

 

कोड मिरर का उपयोग करके सीएसएस कोड को रंगीन किया गया है और इसे लेस सीएसएस में भी लिखा जा सकता है, यह भी काम करता है!

 

कस्टम-टेबल-सीएसएस

 

प्रत्येक सेल, पंक्ति और स्तंभ को पहचानने और उस पर कस्टम सीएसएस लागू करने के लिए उनके निर्देशांक होते हैं। R पंक्ति को और C स्तंभ को दर्शाता है।.

 

सीएसएस-डिस्प्लेइंग

 

8. रिस्पॉन्सिव वर्डप्रेस टेबल

क्या मेरी टेबल रिस्पॉन्सिव हैं या छोटे डिवाइसों पर स्क्रॉल का उपयोग करती हैं?

कॉलम छिपाना

WP Table Manager में रिस्पॉन्सिव डिज़ाइन को प्राथमिकता देने वाले टूल के रूप में एक विकल्प के तौर पर उपलब्ध है। डिफ़ॉल्ट रूप से रिस्पॉन्सिव फ़ीचर अक्षम रहता है, जिससे ओवरफ़्लो की समस्या हो सकती है (हालांकि मोबाइल पर यह ठीक से काम करता है)। कॉलम छिपाने के विकल्प का उपयोग करने के लिए, मेनू फ़ॉर्मेट > रिस्पॉन्सिव विकल्प पर जाएं ।

 

रिस्पॉन्सिव-हाइडिंग-कॉल

 

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

स्क्रॉल सुविधा वाली तालिका (कम कॉलम के लिए बेहतर)

 

रिस्पॉन्सिव-टेबल-स्क्रॉल

 

कॉलम छिपा हुआ टेबल (अधिक संख्या में कॉलम के लिए बेहतर)

 

57bb0cb0ac948

 

दोहराया गया हेडर

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

 

दोहराया-शीर्षक

 

आपकी मांग के अनुसार अनुकूलन के विकल्प उपलब्ध होंगे:

  • रिस्पॉन्सिव ब्रेकपॉइंट (px): पिक्सेल में ब्रेकपॉइंट मान चुनें ताकि यह निर्धारित किया जा सके कि टेबल कब रिस्पॉन्सिव मोड में बदलेगी।
  • रिस्पॉन्सिव अधिकतम ऊंचाई (पिक्सेल): रिस्पॉन्सिव मोड सक्रिय होने पर, ब्रेकपॉइंट मान के आधार पर, एक अधिकतम ऊंचाई निर्धारित करें ताकि टेबल बहुत लंबी न हो जाए।
  • रिस्पॉन्सिव मोड स्टाइलिंग: इस रिस्पॉन्सिव मोड के लिए डिफ़ॉल्ट स्टाइलिंग लागू करें या टेबल के रंगों का उपयोग करें।

उसके बाद, आप देख सकते हैं कि फ्रंटएंड पर टेबल कैसी दिखेगी।.

 

रिपीटेड-हेडर-फ्रंटएंड

 

यदि आप रिपीटेड हेडर का और फ़िल्टर विकल्प सक्षम है, तो आप मोबाइल दृश्य में टेक्स्ट बॉक्स पर टाइप करके फ़िल्टर कर सकते हैं।

 

फ़िल्टर-रिपीटेड-हेडर

 

9. एक्सेल में निर्यात करें

अपनी टेबल को पीसी पर सेव करने के लिए, मेनू टेबल पर जाएं और एक्सपोर्ट एक्सेल बटन पर क्लिक करें । एक्सपोर्ट करने के बाद फ़ाइल का प्रकार *.xlsx होगा।

 

निर्यात-एक्सेल

 

10. पृष्ठ संख्या

प्रत्येक टेबल संस्करण में मेनू फॉर्मेट > पेजिंग में आपको यह सुविधा मिलेगी । टॉगल बटन का उपयोग करके इसे सक्रिय करें और प्रति पृष्ठ प्रदर्शित होने वाली पंक्तियों की संख्या चुनें।

 

पृष्ठीकरण-wptm

 

11. सेल बॉर्डर स्टाइलिंग

आप अपनी टेबल के लिए बॉर्डर के प्रकार जैसे बॉर्डर की चौड़ाई, बॉर्डर का रंग और बॉर्डर की शैली लागू कर सकते हैं। सबसे पहले, सेल रेंज का चयन करें, फिर टूल बार पर आइकन पर क्लिक करें।.

 

बॉर्डर-शैली

 

12. फ्रंटएंड पर तालिका प्रिंट करें

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

 

प्रिंट-बटन