تشاهدون الآن:
	موضوع:طريقة إنشاء جدول داخل مواضيع بلوجر
	سلسلة:[أكواد مهمة للمدونين]
	نبذة:إضافة جدول وخصائصه.
	الصنف:دروس,أكواد,جافاسكريبت,بلوجر

لابد و لاشك أن أسوأ شيئ في بلوجر هو عدم إحتوائه لجدول ضمن قائمة الأدوات رغم أن الجدول من بين أهم الأدوات التي يجب أن تتوفر عليه المدونة لأنه بكل بساطة هو المسؤول عن تنسيق الموضوع وتزيينه والكثير...الكثير.
نذكر مثلاً في مدونة الأفلام أن نضع عنوان الفيلم وصورته ومدته وصنف الفيلم في جدول أفضل من وضع هذه المعلومات في كل سطر.
مثال آخر بواسطة الجداول يمكن تقسيم الصفحة إلى 4 أجزاء أو أكثر  لكتابة الفقرات أفقياً  مثل الجرائد كذلك لوضع الصور واحدة جانب الأخرى أو حتى لصناعة معارض الصور والفيديو.
لذا سنتكلم اليوم عن كيفية إضافة كود جدول بالتفصيل الممل... تابعوا معنا.

جدول معلومات:

الآن لإضافة جدول أنسخ الكود التالي داخل الموضوع بعد الإنتقال إلى وضع html

<div align="center">
<table border="1" cellpadding="5" cellspacing="5" style="background-color: #84d41d; width: 600px;">
<tbody>
<tr>
<th colspan="3" width"600">عنوان 1</th>
</tr>
<tr>
<td width="25%">عنوان 2</td>
<th rowspan="4" width="50%">img</th>
<td width="25%">عنوان 3</td>
</tr>
<tr>
<td width="25%">عنوان 2</td>
<td width="25%">عنوان 3</td>
</tr>
<tr>
<td width="25%">عنوان 2</td>
<td width="25%">عنوان 3</td>
</tr>
<tr>
<td width="25%">عنوان 2</td>
<td width="25%">عنوان 3</td>
</tr>
<tr>
<th colspan="3" width="600">عنوان 1</th>
</tr>
</tbody>
</table>
</div>

النتيجة:

عنوان 1
عنوان 2	img	عنوان 3
عنوان 2		عنوان 3
عنوان 2		عنوان 3
عنوان 2		عنوان 3
عنوان 1

اللون الأزرق لضبط قياسات الجدول والخانات حيث:
:border خاصة بحدود الجدول. (القيمة 0 تعني لا وجود لحدود الجدول)
:width خاصة بالعرض.
cellpading و-cellspasing خاصة بحدود الخلية
اللون الأحمر خاصة بلون خلفية الجدول.
اللون الأصفر خاصة بموضع الجدول.

لإضافة سطر نستعمل الكود

<tr width"600">

<th colspan="3" width"600">عنوان 1</th>

أو

<td colspan="3" width"60%">عنوان 1</td>

</tr>

اللون الأزرق يعني بداية ونهاية السطر.
اللون الأخضر يعني بداية ونهاية الخلية الموجودة داخل سطر.
اللون البرتقالي يعني عرض الخلية أو السطر.
اللون الأحمر هو عرض خلية تلقائي و الذي يحسب  بجمع عرض كل الأعمدة المتواجدة في سطر واحد,  في مثالنا وضعنا 3 لأنه إستعملنا 3 أعمدة في سطر واحد وهي عمود (img,عنوان 2,عنوان 3) .
ملاحظة:
لإضافة خلية يجب دمجها داخل الوسم الملون باللون الأزرق.
لإضافة خلية بسيطة نحذف اللون الأحمر الموجود داخل اللون الأخضر.

لإنشاء الجدول الواقع بين السطرين الذين يحملان الإسم  <عنوان 1 > ننسخ الكود التالي:

<tr>
<td width="25%">عنوان 2</td>
<th rowspan="4" width="50%">img</th>
<td width="25%">عنوان 3</td>
</tr>
<tr>
<td width="25%">عنوان 2</td>
<td width="25%">عنوان 3</td>
</tr>
<tr>
<td width="25%">عنوان 2</td>
<td width="25%">عنوان 3</td>
</tr>
<tr>
<td width="25%">عنوان 2</td>
<td width="25%">عنوان 3</td>
</tr>

اللون الأزرق يعني عرض الخلية أو السطر.
اللون البرتقالي هو لتغيير نص الخلية.
اللون الأصفر يعني بداية ونهاية السطر. في مثالنا وضعنا 4 أسطر
اللون الأحمر يعني بداية ونهاية الخلية الموجودة داخل سطر.
اللون الأخضر يعني عرض خلية تلقائي و الذي يحسب  بجمع عرض كل الأسطر المتواجدة في عمود واحد,  في مثالنا وضعنا 4 لأنه إستعملنا 4 أسطر تحمل الإسم <عنوان 3> .
ملاحظة: 
السطر الأول يحمل 3 خانات أما الأسطر الثلاثة الأخرى تحمل سوى خانتين ويعود السبب إلى الكود الملون باللون الأخضر في السطر الأول, بحيث يقدم خلية واحدة محسوبة تلقائياً وفق عدد  الأسطر.

لإضافة صورة داخل الخلايا نغير اللون البرتقالي img  مثلا بالكود التالي :

<img height="260" src="http://4.bp.blogspot.com/-ciQl0c-hq28/T8D9IA8Sr0I/AAAAAAAABGM/uVEq6mPAA6E/s1600/tableau-html-colspan.png" width="200" />

مع تغيير:
اللون الأحمر برابط الصورة.
اللون الأزرق بطول وعرض الصورة.

صورة توضيحية:

شكراً جزيلاً وإلى الموضوع القادم إن شاء الله.