أذا كنت تبحث عن كيفية انشاء جدول في مقال بلوجر، في هذا المقال وفرت عليك البحث وقمت بتقديم عدة جداول مكونة من كود HTML باحترافية وأشكال وألوان متعددة.
كيف تنشئ جدول في مقال مدونه بلوجر؟
مع الرغم من انه يمكنك تضمين جدول من Microsoft Word، إلا أن ذلك معقدًا بعض الشيء بالنسبة للمستخدم الجديد وصعب التنسيق، ولهذا السبب، سأوضح لك كيفية إنشاء جداول بسهولة في المدونة باستخدام كود HTML.
يعد إدراج قائمة بالمحتوى في جدول منشورات blogger طريقة فعالة لعرض المحتوى. تعرف على كيفية انشاء جدول في مقال مدونه بلوجر؟
هل تبحث عن كيفية انشاء جدول في مقال بلوجر Blogger Post؟
تتوفر العديد من المكونات الإضافية في WordPress والتي تتيح لك إنشاء جداول ببضع نقرات فقط. ولكن للأسف، إذا كانت مدونتك على Blogger، فلن تتمكن من إنشاء جداول لمنشوراتك باستخدام مكون إضافي.
غالبًا ما يكون الجدول ضروريًا لكتابة أي مقارنة أو تمثيل أي بيانات إحصائية على موقع المدونة الخاص بك. ومع ذلك، لا يحتوي Blogger رسميًا على أي عنصر واجهة مستخدم للجدول.
ولهذا السبب، يتعذر على مستخدمي مدونات بلوج استخدام الجدول داخل منشور المدونة.
سأشرح في منشور المدونة هذا كيفية انشاء جدول في منشور بلوجر Blogger Post، بمساعدة هذا المقال، يمكنك بسهولة انشاء جدول في مقال بلوجر Blogger Post، سأوضح الطريقة خطوة بخطوة فقط تابع الشرح.
كيفية انشاء جدول في منشور مدونه بلوجر؟
يمكنك بسهولة انشاء جدول في مقال بمدونتك ،إذا كان لديك فهم أساسي لـ HTML و CSS. لا تقلق، إذا كنت لا تعرف كيفية كتابة كود HTML و CSS للجدول، فإليك الحل بكل سهولة ستتمكن من أنشاء جدول داخل أي مقال بمدونه بلوجر الخاصة بك.
ولكن قبل المتابعة سأشرح معنى علامة HTML الأساسية. نحتاج إلى استخدام ثلاثة أنواع من أكواد HTML لإنشاء جدول. <table> ... </table> ، <tr> ... </tr> ، <td> ... </td>
- <table> ...... </table> يساعد هذا الأمر في إنشاء جدول.
- <tr> .............. </tr> يساعد هذا الأمر في رسم الخط.
- <td> ............. </td> لإنشاء الأعمدة يستخدم هذا الأمر.
كيفية انشاء جدول أساسي 1 صف × 5 عمود باستخدام علامة HTML؟
Alkoptantech ضع هنا المحتوي ضع هنا المحتوي ضع هنا المحتوي ضع هنا المحتوي
كيفية انشاء جدول داخل المقال 2 صف × 5 أعمدة باستخدام علامة HTML؟
لقد تعلمنا انشاء جدول صف واحد × 5 أعمدة، والآن سنتعرف علي كيفية انشاء جدول داخل المقال في مدونه بلوجر 2 صف × 5 عمود.
الكـــــود
ضع هنا المحتوي ضع هنا المحتوي ضع هنا المحتوي ضع هنا المحتوي ضع هنا المحتوي ضع هنا المحتوي ضع هنا المحتوي ضع هنا المحتوي ضع هنا المحتوي ضع هنا المحتوي
- لزيادة سمك حدود الجدول قم بتغيير 1 الي 2/3
- لزيادة عرض الجدول أو إنقاصه غيّر 500px
كيفية انشاء جدول 4 صفوف × 5 أعمدة مع لون جدول العناوين؟
ألان، سنقوم بـ انشاء جدول مكون من 4 صفوف × 5 أعمدة برأس ملون. بشكل عام، في العنوان يمكننا إضافة تفاصيل وفي الخانات الأخرى، يمكننا كتابة بيانات المحتوي.
الكــــCODـــود
ضع هنا المحتوي ضع هنا المحتوي ضع هنا المحتوي ضع هنا المحتوي ضع هنا المحتوي Alkoptantecch Alkoptantecch Alkoptantecch Alkoptantecch Alkoptantecch Alkoptantecch Alkoptantecch Alkoptantecch Alkoptantecch Alkoptantecch Alkoptantecch Alkoptantecch Alkoptantecch Alkoptantecch Alkoptantecch
- لزيادة سمك حدود الجدول قم بتغيير 1 الي 2/3
- لزيادة عرض الجدول أو إنقاصه غيّر 500px
- لتغير لون جدول العنوان غير الرمز "#E73A3A" الي اي لون أخر.
- لون أزرق "1c2fe6"
- لون برتقالي "e8d71d"
- لون موف "9900ff"
كيفية انشاء جدول في مقال بلوجر 4 صفوف × 5 أعمده جدول متعدد الألوان؟
|
| الشكل رقم (1) |
|
|
الشكل رقم (2) |
ضع هنا المحتوي ضع هنا المحتوي ضع هنا المحتوي ضع هنا المحتوي ضع هنا المحتوي Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan
كود الشكل رقم 2
ضع هنا المحتوى ضع هنا المحتوى ضع هنا المحتوى ضع هنا المحتوى ضع هنا المحتوى Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan
- لزيادة سمك حدود الجدول قم بتغيير 1 الي 2/3.
- لزيادة عرض الجدول أو إنقاصه غيّر 500px.
- لتغير ألون خلفية الجدول غير الرموز الي أي لون أخر. (E73A3A# ، #0092FF ، #00FFA8 #FCFF00).
كيف يتم تنفيذ الجدول في منشور مدونة بلوجر؟
- قم بتسجيل الدخول إلى حسابك على بلوجر Blogger وانتقل إلى لوحة التحكم الرئيسية.
- من لوحة التحكم الرئيسية ، انقر فوق + مشاركة جديدة.
- قم بإنشاء منشور جديد وقم بكتابة المنشور(المحتوي) الخاص بك.
- من محرر النشر، غير عرض وضع الإنشاء إلي عرض HTML، ثم أضف رمز الجدول في المكان الذي تريده، كما موضح بالصورة.
- الأن يمكنك تعديل المحتوي بالجدول بكل سهولة.
6. أخيراً أنشر منشور المدونة الخاص بك، وتحقق الآن من المنشور وشاهد الجدول الذي تم إنشاؤه بواسطة كود HTML.
جدول HTML متجاوب مع تأثيرات CSS احترافية
- رأس ملون يلفت الانتباه ويُبرز العناوين.
- صفوف بألوان متناوبة لتحسين سهولة القراءة والتنقل البصري.
- تأثير تفاعلي عند تمرير مؤشر الفأرة (Hover effect) على الخلايا.
- تصميم متجاوب بالكامل يعمل بسلاسة على جميع أحجام الشاشات، بما في ذلك الهواتف الذكية، باستخدام media queries.
العنوان 1 العنوان 2 العنوان 3 العنوان 4 العنوان 5 Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan
Column One Column Two Column Three Column Four Column Five Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan
العنوان 1 العنوان 2 العنوان 3 العنوان 4 العنوان 5 Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan Alkoptan
ما الفرق بين الجدول العربي والجدول الإنجليزي؟
الفرق الأساسي بين الجدول العربي والإنجليزي يكمن في اتجاه النص داخل الجدول
- الجدول العربي يستخدم الاتجاه من اليمين إلى اليسار (dir="rtl")، وهو مناسب للنصوص العربية حيث يبدأ النص من الجهة اليمنى.
- الجدول الإنجليزي يستخدم الاتجاه من اليسار إلى اليمين (dir="ltr")، وهو الاتجاه الطبيعي للغات اللاتينية مثل الإنجليزية.
- ترتيب الأعمدة من أي جهة يبدأ.
كيف تُعدل الاتجاه؟
يمكنك تعديل اتجاه الجدول بسهولة عن طريق خاصية dir داخل وسم <table>:
الجداول للعربية:
الجداول الإنجليزية:
إذا نسيت ضبط الاتجاه، قد يظهر الجدول بطريقة مربكة، خاصةً إذا كانت واجهة موقعك بلغتين أو أكثر.يمكنك تحويل الجدول من النسخة العربية إلى النسخة الإنجليزية أو العكس بسهولة. كل ما عليك هو تعديل الاتجاه كما ذكرت وتغير محتوى الخلايا داخل الجدول بما يتناسب مع اللغة المطلوبة، مع الحفاظ على نفس الهيكل والتنسيق. لا حاجة لتعديل الأكواد الخاصة بالتصميم، فقط استبدل النصوص لتناسب اللغة التي تفضلها.
الأسئلة الشائعة حول كيفية انشاء جدول في مقال
على الرغم من أن منصة بلوجر لا تدعم المكونات الإضافية (Plugins) مثل بعض أنظمة إدارة المحتوى الأخرى، فإنه يمكنك بسهولة إدراج جدول داخل المقال باستخدام كود HTML يدوي مثل الكود الموضح في هذا الشرح.
ما عليك سوى نسخ الكود ولصقه في وضع "HTML" داخل محرر المقالات في بلوجر، وسيظهر الجدول بشكل منسّق ومتجاوب داخل المقال.
لا، استخدام كود HTML لإنشاء جدول في المقال لا يؤثر على سرعة تحميل الصفحة أو أداء المدونة، خاصةً إذا تم استخدام كود نظيف وخفيف مثل الكود المقدم في هذا الشرح. فهو لا يحتوي على سكربتات ثقيلة أو ملفات خارجية، مما يجعله خيارًا آمنًا وفعّالًا.
نعم، يمكنك إنشاء أي عدد من الجداول داخل نفس المقال باستخدام كود HTML دون أي مشاكل. كما يمكنك بسهولة تعديل خصائص كل جدول، مثل:
- عدد الأعمدة والصفوف.
- ألوان الخلايا والرأس.
- محاذاة النصوص.
- تأثيرات التمرير والهوامش.
وهذا يمنحك مرونة كبيرة في تنسيق البيانات داخل مقالاتك.
سعدنا بوجودك 😍 شكراً لك اترك تعليقك بمدى أستفادتك من المحتوى دعمنا لنا وسيتم الرد عليك في أقرب وقت. يسعدنا دائماً اقتراحاتكم بخصوص المحتوى وأذا كان لديك أى أستفسار لاتترد بالتعليق أو المراسلة عبر صندوق البريد.