في الأيام الأولى لبناء موقع الويب، طاولات تم تصميمها في الأساس لعرضها على سطح المكتب، حيث كانت مساحة الشاشة وفيرة. ومع بدء تضمين مواقع الويب لبيانات معقدة، أصبحت الجداول طريقة شائعة لتنظيم كميات كبيرة من المعلومات بشكل أنيق.
مع تزايد استخدام الأجهزة المحمولة، أصبحت الحاجة إلى الجداول المتجاوبة أمرًا حيويًا. فقد قام المزيد من المستخدمين بالوصول إلى مواقع الويب عبر الهواتف والأجهزة اللوحية، حيث تسببت الجداول التقليدية في إحباط المستخدمين من خلال مطالبتهم بالتمرير الأفقي أو التكبير لمجرد قراءة المحتوى.
اليوم، لا تتعلق الجداول المستجيبة بالراحة فحسب؛ بل إنها ضرورية لتحسين محركات البحث وإمكانية الوصول، وخاصة مع فهرسة Google التي تركز على الأجهزة المحمولةعلى الرغم من أن كتلة الجدول الافتراضية في WordPress تفتقر إلى الاستجابة المضمنة، فستحتاج إلى طرق مثل تعديلات CSS أو المكونات الإضافية لحل هذه المشكلة.
في هذا الدليل، سنتناول أبسط طريقة لإنشاء جداول مُحسّنة للأجهزة المحمولة في WordPress باستخدام مكون إضافي.
الخطوة 1: تثبيت وتفعيل البرنامج الإضافي Tableberg
الخطوة الأولى بسيطة. انتقل إلى لوحة تحكم ووردبريس وانتقل إلى المكونات الإضافية > إضافة جديدبمجرد وصولك إلى هناك، اكتب Tableberg وابحث عن البرنامج الإضافي. بمجرد العثور عليه، انقر فوق قم بالتثبيت الآن. بعد التثبيت، كل ما تبقى هو فعل انقر فوق "تنشيط" لتمكين البرنامج الإضافي على موقعك.
الخطوة 2: إنشاء جدول جديد باستخدام Tableberg
من محرر WordPress الخاص بك، انقر فوق أيقونة زائد (+)، بحث عن Tableberg، ثم قم بإضافة كتلة Tableberg.
اختر عدد الصفوف والأعمدة للجدول الخاص بك ثم اضغط على زر إنشاء. في هذا البرنامج التعليمي، اخترنا جدولًا يحتوي على 4 صفوف و5 أعمدة.
الخطوة 3: إضافة البيانات إلى الجدول الخاص بك
بعد إنشاء الجدول الخاص بكسيتم نقلك إلى محرر الجدول، حيث يمكنك إضافة محتوى إلى كل خلية. انقر فوق أي خلية، ثم اضغط على علامة الجمع (+) اكتب الكتلة المطلوبة، ثم استمر في إدخال النص، والصور، والقوائم، وتقييمات النجوم، والأزرار، أو أي شيء يناسب متطلباتك.
الخطوة 4: تمكين الإعدادات المستجيبة
للتأكد من عرض جدولك بشكل جيد عبر جميع الأجهزة، يقدم Tableberg عرضًا منظمًا إعدادات الاستجابة القسم. أولاً، حدد كتلة الوالدين، انتقل إلى إعدادات على الجانب الأيمن من المحرر، ثم قم بالتمرير لأسفل للعثور على إعدادات الاستجابة.
بعد ذلك، اختر الجهاز الذي ترغب في تكوين الاستجابة له. في الجزء العلوي من لوحة إعدادات الاستجابة، سترى خيارات سطح المكتب, الكمبيوتر اللوحي، و متحركحدد الجهاز الذي تريد تخصيصه، حيث سيحدد هذا كيفية تصرف الجدول على حجم الشاشة المحدد. هنا، حددنا "الجوال".
مع تحديد الجهاز، قم بالتبديل إلى تمكين نقطة التوقف خيار لتنشيط السلوك المستجيب للجهاز المختار. يسمح هذا الإعداد للجدول بتطبيق تعديلات الاستجابة عندما يكون عرض الشاشة عند القيمة التي حددتها أو أقل منها في الحد الأقصى للعرضعلى سبيل المثال، يعني تعيين الحد الأقصى للعرض إلى 1024 بكسل أن الجدول سوف يتكيف بشكل متجاوب مع الشاشات التي يقل عرضها عن 1024 بكسل. أسفل هذا الإعداد، ستجد خيار Make رأس الصف العلوي خيار يقوم بتعيين الصف الأول من الجدول كرأس ويطبق أنماطًا أو تنسيقًا محددًا لتمييزه عن الصفوف الأخرى.
وأخيرا، استخدم وضع خيار لاختيار كيفية تصرف الجدول على الشاشات الأصغر حجمًا. يمكنك تحديد التمرير لتمكين التمرير الأفقي والسماح للمستخدمين بالتمرير عبر الجدول إذا كان واسعًا للغاية. بدلاً من ذلك، اختر كومة لإعادة ترتيب محتوى الجدول عموديًا. عند استخدام وضع التكديس، تتوفر خيارات إضافية مثل اتجاه المكدس تتيح لك التحكم في اتجاه التكديس، و العناصر لكل صف يسمح لك بتعيين عدد العناصر التي يجب أن تظهر في كل صف لتوفير المزيد من التخصيص للشاشات الأصغر.
هذا كل شيء - لقد أصبحت طاولتك جاهزة للتألق على الشاشات بأي حجم. انشرها واترك بياناتك تتدفق بسلاسة عبر أجهزة الكمبيوتر المكتبية والأجهزة اللوحية والهواتف!
خاتمة
لا تعد الجداول المستجيبة مجرد ميزة، بل إنها ضرورية في عالم WordPress اليوم. مع Tableberg، حولت الجداول التقليدية إلى شيء يتكيف ويتحرك ويتألق على أي شاشة. يقدم موقعك الآن طريقة أنظف وأكثر سهولة في الوصول لعرض البيانات، سواء تم عرضها على سطح المكتب أو الجهاز اللوحي أو الهاتف. يمكنك أن تقول وداعًا للشاشات الضخمة وترحب بتجربة مستخدم تتدفق بسلاسة مثل المحتوى الخاص بك. سيحب جمهورك الترقية، وكذلك محركات البحث.
