أذا كنت تبحث عن كيفية انشاء جدول في مقال بلوجر، في هذا المقال وفرت عليك البحث وقمت بتقديم عدة جداول مكونة من كود 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؟
<table border="1">
<tbody>
<tr>
<td>Alkoptantech</td>
<td>ضع هنا المحتوي</td>
<td>ضع هنا المحتوي</td>
<td>ضع هنا المحتوي</td>
<td>ضع هنا المحتوي</td>
</tr>
</tbody>
</table>
كيفية انشاء جدول داخل المقال 2 صف × 5 أعمدة باستخدام علامة HTML؟
لقد تعلمنا انشاء جدول صف واحد × 5 أعمدة، والآن سنتعرف علي كيفية انشاء جدول داخل المقال في مدونه بلوجر 2 صف × 5 عمود.
الكـــــود
<table border="1" style="width: 500px;">
<tbody>
<tr>
<td style="text-align: center;">ضع هنا المحتوي</td>
<td style="text-align: center;">ضع هنا المحتوي</td>
<td style="text-align: center;">ضع هنا المحتوي</td>
<td style="text-align: center;">ضع هنا المحتوي</td>
<td style="text-align: center;">ضع هنا المحتوي</td>
</tr>
<tr>
<td style="text-align: center;">ضع هنا المحتوي</td>
<td style="text-align: center;">ضع هنا المحتوي</td>
<td style="text-align: center;">ضع هنا المحتوي</td>
<td style="text-align: center;">ضع هنا المحتوي</td>
<td style="text-align: center;">ضع هنا المحتوي</td>
</tr>
</tbody>
</table>
- لزيادة سمك حدود الجدول قم بتغيير 1 الي 2/3
- لزيادة عرض الجدول أو إنقاصه غيّر 500px
كيفية انشاء جدول 4 صفوف × 5 أعمدة مع لون جدول العناوين؟
ألان، سنقوم بـ انشاء جدول مكون من 4 صفوف × 5 أعمدة برأس ملون. بشكل عام، في العنوان يمكننا إضافة تفاصيل وفي الخانات الأخرى، يمكننا كتابة بيانات المحتوي.
الكــــCODـــود
<table border="1" style="width: 500px;">
<tbody>
<tr bgcolor="#E73A3A">
<td style="text-align: center;"><span style="color: white;">ضع هنا المحتوي</span></td>
<td style="text-align: center;"><span style="color: white;">ضع هنا المحتوي</span></td>
<td style="text-align: center;"><span style="color: white;">ضع هنا المحتوي</span></td>
<td style="text-align: center;"><span style="color: white;">ضع هنا المحتوي</span></td>
<td style="text-align: center;"><span style="color: white;">ضع هنا المحتوي</span></td>
</tr>
<tr>
<td style="text-align: center;">Alkoptantecch</td>
<td style="text-align: center;">Alkoptantecch</td>
<td style="text-align: center;">Alkoptantecch</td>
<td style="text-align: center;">Alkoptantecch</td>
<td style="text-align: center;">Alkoptantecch</td>
</tr>
<tr>
<td style="text-align: center;">Alkoptantecch</td>
<td style="text-align: center;">Alkoptantecch</td>
<td style="text-align: center;">Alkoptantecch</td>
<td style="text-align: center;">Alkoptantecch</td>
<td style="text-align: center;">Alkoptantecch</td>
</tr>
<tr>
<td style="text-align: center;">Alkoptantecch</td>
<td style="text-align: center;">Alkoptantecch</td>
<td style="text-align: center;">Alkoptantecch</td>
<td style="text-align: center;">Alkoptantecch</td>
<td style="text-align: center;">Alkoptantecch</td>
</tr>
</tbody>
</table>
- لزيادة سمك حدود الجدول قم بتغيير 1 الي 2/3
- لزيادة عرض الجدول أو إنقاصه غيّر 500px
- لتغير لون جدول العنوان غير الرمز "#E73A3A" الي اي لون أخر.
- لون أزرق "1c2fe6"
- لون برتقالي "e8d71d"
- لون موف "9900ff"
كيفية انشاء جدول في مقال بلوجر 4 صفوف × 5 أعمده جدول متعدد الألوان؟
الشكل رقم (1) |
الشكل رقم (2) |
<table border="1" style="width: 500px;">
<tbody>
<tr bgcolor="#E73A3A">
<td style="text-align: center;"><span style="color: white;">ضع هنا المحتوي</span></td>
<td style="text-align: center;"><span style="color: white;">ضع هنا المحتوي</span></td>
<td style="text-align: center;"><span style="color: white;">ضع هنا المحتوي</span></td>
<td style="text-align: center;"><span style="color: white;">ضع هنا المحتوي</span></td>
<td style="text-align: center;"><span style="color: white;">ضع هنا المحتوي</span></td>
</tr>
<tr bgcolor="#0092FF">
<td style="text-align: center;">Alkoptan</td>
<td style="text-align: center;">Alkoptan</td>
<td style="text-align: center;">Alkoptan</td>
<td style="text-align: center;">Alkoptan</td>
<td style="text-align: center;">Alkoptan</td>
</tr>
<tr bgcolor="#00FFA8">
<td style="text-align: center;">Alkoptan</td>
<td style="text-align: center;">Alkoptan</td>
<td style="text-align: center;">Alkoptan</td>
<td style="text-align: center;">Alkoptan</td>
<td style="text-align: center;">Alkoptan</td>
</tr>
<tr bgcolor="#FCFF00">
<td style="text-align: center;">Alkoptan</td>
<td style="text-align: center;">Alkoptan</td>
<td style="text-align: center;">Alkoptan</td>
<td style="text-align: center;">Alkoptan</td>
<td style="text-align: center;">Alkoptan</td>
</tr>
</tbody>
</table>
كود الشكل رقم 2
<table border="1" style="width: 500px;">
<tbody>
<tr bgcolor="#110718">
<td style="text-align: center;"><span style="color: white;"><b>ضع هنا المحتوي</b></span></td>
<td style="text-align: center;"><span style="color: white;"><b>ضع هنا المحتوي</b></span></td>
<td style="text-align: center;"><span style="color: white;"><b>ضع هنا المحتوي</b></span></td>
<td style="text-align: center;"><span style="color: white;"><b>ضع هنا المحتوي</b></span></td>
<td style="text-align: center;"><span style="color: white;"><b>ضع هنا المحتوي</b></span></td>
</tr>
<tr bgcolor="#bdb6c1">
<td style="text-align: center;">Alkoptan</td>
<td style="text-align: center;">Alkoptan</td>
<td style="text-align: center;">Alkoptan</td>
<td style="text-align: center;">Alkoptan</td>
<td style="text-align: center;">Alkoptan</td>
</tr>
<tr bgcolor="#bdb6c1">
<td style="text-align: center;">Alkoptan</td>
<td style="text-align: center;">Alkoptan</td>
<td style="text-align: center;">Alkoptan</td>
<td style="text-align: center;">Alkoptan</td>
<td style="text-align: center;">Alkoptan</td>
</tr>
<tr bgcolor="#bdb6c1">
<td style="text-align: center;">Alkoptan</td>
<td style="text-align: center;">Alkoptan</td>
<td style="text-align: center;">Alkoptan</td>
<td style="text-align: center;">Alkoptan</td>
<td style="text-align: center;">Alkoptan</td>
</tr>
</tbody>
</table><div><br /></div>
- لزيادة سمك حدود الجدول قم بتغيير 1 الي 2/3.
- لزيادة عرض الجدول أو إنقاصه غيّر 500px.
- لتغير ألون خلفية الجدول غير الرموز الي أي لون أخر. (E73A3A# ، #0092FF ، #00FFA8 #FCFF00).
كيف يتم تنفيذ الجدول في منشور مدونة بلوجر؟
- قم بتسجيل الدخول إلى حسابك على بلوجر Blogger وانتقل إلى لوحة التحكم الرئيسية.
- من لوحة التحكم الرئيسية ، انقر فوق + مشاركة جديدة.
- قم بإنشاء منشور جديد وقم بكتابة المنشور(المحتوي) الخاص بك.
- من محرر النشر، غير عرض وضع الإنشاء إلي عرض HTML، ثم أضف رمز الجدول في المكان الذي تريده، كما موضح بالصورة.
- الأن يمكنك تعديل المحتوي بالجدول بكل سهولة.
6. أخيراً أنشر منشور المدونة الخاص بك، وتحقق الآن من المنشور وشاهد الجدول الذي تم إنشاؤه بواسطة كود HTML.
الأسئلة الشائعة
مع الرغم من أن جوجل لا تسمح بمكونات إضافية، يمكنك انشاء جدول في مقال بلوجر باستخدام كود HTML الذي المستخدم في الشرح.
لا يؤثر كود HTML المستخدم بالشرح علي سرعة الصفحة.
نعم، يمكنك القيام بذلك بسهولة وانشاء أكثر من جدول داخل المقال كما تشاء باستخدام كود HTML وليس له أي تأثير. ويمكنك تغير جميع خصائص الجدول بسهولة وتغير عدد الأعمدة والصفوف وأيضاً يمكنك تغير الألوان.
سعدنا بوجودك 😍 شكراً لك اترك تعليقك بمدى أستفادتك من المحتوى دعمنا لنا وسيتم الرد عليك في أقرب وقت. يسعدنا دائماً اقتراحاتكم بخصوص المحتوى وأذا كان لديك أى أستفسار لاتترد بالتعليق أو المراسلة عبر صندوق البريد.