ওয়ার্ডপ্রেসে একটি ডেটা টেবিল তৈরি করার অর্থ সাধারণত HTML এর সাথে লড়াই করা বা একটি শর্টকোড আটকানো যা আপনি স্টাইল করতে পারবেন না। বিনামূল্যে ডায়নামিক টেবিল উইজেট মধ্যে এলিমেন্টরের জন্য মাস্টার অ্যাডঅন আপনাকে একটি দৃশ্যত তৈরি করতে দেয়: হেডার কলাম যোগ করুন, সারি পূরণ করুন এবং এলিমেন্টর প্যানেলের প্রতিটি অংশ স্টাইল করুন। কোন টেবিল মার্কআপ নেই, কোন প্লাগইন লক-ইন নেই।
এটি একটি গ্রিডের অন্তর্গত যেকোন কিছুর জন্য উপযুক্ত, যেমন কর্মচারী ডিরেক্টরি, বিশেষ শীট, সময়সূচী বা মূল্য তালিকা। আপনি সেল মার্জ করতে পারেন, হেডারে আইকন যোগ করতে পারেন, সারি স্ট্রাইপ করতে পারেন এবং ফোনের জন্য একটি প্রতিক্রিয়াশীল মোড চালু করতে পারেন। নীচে হেডার সেল থেকে স্টাইলিং ট্যাব পর্যন্ত প্রতিটি সেটিং এর মাধ্যমে একটি রান রয়েছে।
ডায়নামিক টেবিল উইজেট কি করে #
উইজেট দুটি রিপিটার থেকে একটি স্ট্যান্ডার্ড এইচটিএমএল টেবিল তৈরি করে: একটি হেডার সারির জন্য এবং একটি বডি সেলের জন্য। প্রতিটি ঘর তার নিজস্ব আইটেম, তাই আপনি কোনো কোড না লিখে পাঠ্য, প্রান্তিককরণ এবং এমনকি কলাম বা সারি স্প্যান নিয়ন্ত্রণ করেন।
এটিতে তিনটি ট্যাব রয়েছে: হেডার, বডি এবং সেটিংসের জন্য সামগ্রী, রঙ এবং ব্যবধানের জন্য শৈলী এবং সাধারণ এলিমেন্টর বিকল্পগুলির জন্য উন্নত৷ ফলাফল হল একটি পরিষ্কার, প্রতিক্রিয়াশীল টেবিল যা আপনার থিমের সাথে মেলে।
আপনি শুরু করার আগে #
- ওয়ার্ডপ্রেস সঙ্গে এলিমেন্টর ইনস্টল এবং সক্রিয়।
- এলিমেন্টরের জন্য মাস্টার অ্যাডঅন ইনস্টল এবং সক্রিয়। প্লাগইনে নতুন? দেখা ইনস্টলেশন গাইড.
- আপনি যে ডেটা দেখাতে চান, কলাম এবং সারি হিসাবে স্কেচ আউট।
কিভাবে ডায়নামিক টেবিল উইজেট যোগ করবেন #
Elementor এডিটরে, খুলুন উপাদান প্যানেল এবং অনুসন্ধান করুন ডায়নামিক টেবিল, অথবা মাস্টার অ্যাডঅন বিভাগে স্ক্রোল করুন। এটি আপনার পৃষ্ঠায় টেনে আনুন। এটি একটি নমুনা টেবিলের সাথে লোড হয় যাতে আপনি একটি খালি গ্রিডের পরিবর্তে একটি কাজের বিন্যাস থেকে সম্পাদনা করেন।
টেবিল হেডার সেট আপ করুন #
খোলা বিষয়বস্তু ট্যাব। দ্য টেবিল হেড বিভাগ শিরোনাম সারি ধারণ করে। দ্য টেবিল হেড টগল দেখায় বা হেডার লুকিয়ে রাখে, এবং টেবিল হেডার সেল রিপিটার প্রতি কলামে একটি আইটেম ধারণ করে।
প্রতিটি হেডার সেলের নিজস্ব বিষয়বস্তু এবং বিকল্প সাব-ট্যাব রয়েছে। ভিতরে বিষয়বস্তু আপনি সেট কলামের নাম এবং একটি যোগ করতে পারেন আইকন অথবা একটি ছবি এর পাশে (প্রকার: কোনটি নয়, আইকন বা চিত্র)। ব্যবহার আইটেম যোগ করুন কলাম যোগ করতে, একটি নকল করতে কপি আইকন এবং এটি সরাতে X।
টেবিল বডি পূরণ করুন #
দ্য টেবিল বডি বিভাগ কোষ ধারণ করে। প্রতিটি আইটেম একটি কোষ, এবং একটি নতুন সারি? যেখানে একটি নতুন সারি শুরু হয় সেখানে চিহ্নগুলি টগল করুন, তাই আপনি ক্রমানুসারে ঘর যোগ করুন এবং প্রতিটি সারির শুরুতে পতাকাঙ্কিত করুন।
প্রতিটি শরীরের কোষে বিষয়বস্তু এবং বিকল্প উপ-ট্যাব রয়েছে:
- বডি টেক্সট: সেল বিষয়বস্তু, যা গতিশীল ট্যাগ গ্রহণ করে। প্রতিটি ট্যাগ একটি ঘর পূরণ করে।
- কলাম স্প্যান এবং রো স্প্যান: কলাম বা সারি জুড়ে একটি ঘর মার্জ করুন।
- কাস্টম প্রস্থ: সেই কলামের জন্য একটি নির্দিষ্ট প্রস্থ সেট করুন।
- প্রান্তিককরণ: বাম, কেন্দ্র, ডান, বা ঘরের মধ্যে ন্যায্যতা।
- সজ্জা: সেল টেক্সটের জন্য আন্ডারলাইন, ওভারলাইন বা লাইন থ্রু।
টেবিল বাড়াতে, ক্লিক করুন আইটেম যোগ করুন, সেল টেক্সট টাইপ করুন, এবং চালু করুন নতুন সারি? প্রতিটি নতুন লাইনের প্রথম কক্ষে। এখানে একটি পঞ্চম কর্মচারী সারি যোগ করা হচ্ছে।
টেবিল প্রতিক্রিয়াশীল করুন #
দ্য সেটিংস বিভাগে একটি আছে প্রতিক্রিয়াশীল টেবিল? টগল করুন। এটি চালু করার সাথে সাথে, টেবিলটি উপচে পড়ার পরিবর্তে ছোট স্ক্রিনে পুনরায় প্রবাহিত হয়, তাই প্রতিটি সারি 768px চওড়া ডিভাইসে একটি পাঠযোগ্য কার্ডে স্ট্যাক করে, কলামের নামটি একটি লেবেল হিসাবে দেখানো হয়। এটি এমন সেটিং যা লোকেরা ভুলে যায় এবং এই কারণেই মোবাইলে একটি টেবিল ভাঙা দেখায়।
টেবিল শৈলী #
দ্য শৈলী ট্যাব বিভক্ত করা হয় গ্লোবাল স্টাইল, টেবিল হেডার শৈলী, এবং টেবিল বডি, প্লাস নিদর্শন (একটি প্রো বিকল্প)। দ্য গ্লোবাল স্টাইল বিভাগটি টেবিল-ওয়াইড লুক সেট করে।
- ডোরাকাটা টেবিল: জেব্রা স্ট্রাইপিং চালু করুন এবং ডোরাকাটা সারির রঙ চয়ন করুন।
- পটভূমির রঙ: কোষের পিছনে বেস রঙ।
- অভ্যন্তরীণ কোষ প্যাডিং: প্রতিটি কক্ষের ভিতরের স্থান।
- বর্ডার টাইপ এবং বর্ডার ব্যাসার্ধ: কোষ এবং বৃত্তাকার কোণ মধ্যে লাইন।
হেডার এবং বডি স্টাইলিং #
দ্য টেবিল হেডার শৈলী বিভাগটি হেডারের পটভূমি, পাঠ্যের রঙ, টাইপোগ্রাফি এবং প্যাডিং সেট করে যাতে উপরের সারিটি আলাদা থাকে। দ্য টেবিল বডি বিভাগ ডেটা কোষের জন্য একই কাজ করে।
- পটভূমির রঙ এবং পাঠ্যের রঙ: শরীরের কোষের রং।
- আইকন সাইজ, আইকন কালার এবং আইকন প্যাডিং: যেকোনো সেল আইকনের জন্য স্টাইলিং।
- প্রান্তিককরণ এবং টাইপোগ্রাফি: বডি টেক্সট বসে এবং দেখতে কেমন।
পৃষ্ঠায় ফলাফল #
প্রকাশ করুন বা পূর্বরূপ দেখুন এবং টেবিলটি আপনার কলাম, সারি এবং স্ট্রাইপিং এর সাথে রেন্ডার করে, যদি আপনি এটি চালু করেন তবে মোবাইলে প্রতিক্রিয়াশীল।
সাধারণ ব্যবহারের ক্ষেত্রে #
- কর্মচারী বা দলের ডিরেক্টরি নাম, ভূমিকা এবং যোগাযোগের বিবরণ সহ।
- স্পেক শীট পণ্য বৈশিষ্ট্য এবং মান তুলনা।
- সময়সূচী এবং সময়সূচী ক্লাস, ইভেন্ট বা অফিস সময়ের জন্য।
- মূল্য তালিকা যে একটি পূর্ণ প্রয়োজন নেই মূল্য সারণী.
- ডেটা সারাংশ একটি স্টাইল করা গ্রিডে একটি স্প্রেডশীট থেকে টানা।
ডায়নামিক টেবিল উইজেটের সাথে কাজ করার জন্য টিপস #
- প্রথমে কলাম পরিকল্পনা করুন। বডি পূরণ করার আগে প্রতিটি হেডার সেল সেট করুন যাতে সারিগুলি লাইন আপ হয়।
- শুধুমাত্র প্রথম কক্ষে নতুন সারি চিহ্নিত করুন। প্রতিটি সারির শুরুতে পতাকাঙ্কিত করুন, প্রতিটি ঘর নয়, বা লেআউট বিরতি।
- ফোনের জন্য প্রতিক্রিয়াশীল টেবিল চালু করুন। এটি চালু না থাকলে মোবাইলে প্রশস্ত টেবিল ওভারফ্লো হয়।
- লম্বা টেবিলের জন্য স্ট্রাইপিং ব্যবহার করুন। জেব্রা সারি একটি লম্বা ডেটা টেবিল স্ক্যান করা অনেক সহজ করে তোলে।
- সেল টেক্সট ছোট রাখুন। লম্বা স্ট্রিংগুলি একটি কলাম প্রসারিত করে, তাই জিনিসগুলিকে সমান রাখতে কাস্টম প্রস্থ ব্যবহার করুন।
প্রায়শই জিজ্ঞাসিত প্রশ্নাবলী #
মাস্টার অ্যাডঅনগুলিতে ডায়নামিক টেবিল উইজেট কী?
এটি একটি এলিমেন্টর উইজেট যা দৃশ্যত একটি HTML ডেটা টেবিল তৈরি করে। আপনি রিপিটারের মাধ্যমে হেডার কলাম এবং বডি সেল যোগ করুন, তারপর প্যানেল থেকে রঙ, প্যাডিং, সীমানা এবং স্ট্রাইপিং স্টাইল করুন। কোন HTML বা শর্টকোড জড়িত নেই, এবং টেবিলটিকে প্রতিক্রিয়াশীল করা যেতে পারে।
আমি কি ডায়নামিক টেবিলে কোষগুলিকে একত্রিত করতে পারি?
হ্যাঁ। প্রতিটি বডি সেলের অপশন সাব-ট্যাবে কলাম স্প্যান এবং রো স্প্যান বিকল্প রয়েছে। একাধিক কলাম বা সারি জুড়ে সেই ঘরটিকে একত্রিত করতে একটি স্প্যান সেট করুন, যা টেবিলের ভিতরে গোষ্ঠীবদ্ধ শিরোনাম বা সারাংশ সারিগুলির জন্য দরকারী।
ডায়নামিক টেবিল কি মোবাইলে প্রতিক্রিয়াশীল?
হ্যাঁ। সেটিংস বিভাগে একটি প্রতিক্রিয়াশীল টেবিল টগল রয়েছে। এটি চালু করার সাথে সাথে, টেবিলটি ছোট স্ক্রিনে পুনরায় প্রবাহিত হয় যাতে প্রতিটি সারি পৃষ্ঠাটি উপচে পড়ার পরিবর্তে একটি পাঠযোগ্য ব্লকে স্ট্যাক করে, যা ফোনে প্রশস্ত টেবিলগুলিকে ব্যবহারযোগ্য রাখে।
আমি কি টেবিলে ডোরাকাটা সারি যোগ করতে পারি?
হ্যাঁ। স্টাইল ট্যাবে, গ্লোবাল স্টাইল বিভাগে একটি স্ট্রাইপড টেবিল টগল এবং একটি স্ট্রাইপড ব্যাকগ্রাউন্ড কালার রয়েছে। জেব্রা স্ট্রাইপিং যোগ করতে এটি চালু করুন, যা সারির রঙকে বিকল্প করে এবং লম্বা টেবিলগুলিকে পড়তে অনেক সহজ করে তোলে।
আমি কি টেবিল হেডারে আইকন যোগ করতে পারি?
হ্যাঁ। প্রতিটি হেডার সেলের None, আইকন বা ইমেজ সহ একটি টাইপ বিকল্প রয়েছে। আইকন লাইব্রেরি থেকে একটি বাছাই করতে আইকন বা ছবি আপলোড করতে ছবি বেছে নিন। আইকনটি কলামের নামের পাশে দেখায়, যা এক নজরে ইমেল, ফোন বা অবস্থানের মতো কলাম লেবেল করতে সহায়তা করে।
আমি কি ডায়নামিক টেবিলে একটি CSV বাছাই, অনুসন্ধান বা আমদানি করতে পারি?
না। উইজেটে কোনো বাছাই, অনুসন্ধান, পৃষ্ঠা সংখ্যা বা CSV আমদানি নেই। তাদের জন্য, টেবিলপ্রেসের মতো একটি ডেটা টেবিল প্লাগইন ব্যবহার করুন এবং পৃষ্ঠায় এর শর্টকোড রাখুন।
মোড়ানো #
দ্য ডায়নামিক টেবিল উইজেট HTML স্পর্শ না করেই ডেটার সারি এবং কলামগুলিকে একটি পরিষ্কার, স্টাইল করা টেবিলে পরিণত করে৷ আপনার শিরোনাম সেট করুন, বডি সেল যোগ করুন, প্রতিটি নতুন সারি পতাকাঙ্কিত করুন, তারপর আপনার পৃষ্ঠার সাথে মেলে রঙ, স্ট্রাইপিং এবং সীমানা স্টাইল করুন। সম্পর্কিত ডেটা লেআউটের জন্য, দেখুন তুলনা টেবিল উইজেট (প্রো) এবং মূল্য নির্ধারণ টেবিল উইজেট, সম্পূর্ণ ব্রাউজ করুন মাস্টার অ্যাডঅন উইজেট এবং এক্সটেনশন, এবং চেক করুন মূল্য পৃষ্ঠা প্রতিটি পরিকল্পনা অন্তর্ভুক্ত কি জন্য।
