شرح ربط منتدى زينفورو xenforo مع Google 2020

مرحباً يا أصدقاء ، مرحباً بك في هذا الدرس التعليمي اليوم سأوضح لك كيفية إنشاء جدول في مشاركة Blogger مع الصور أو إنشاء جدول في مشاركة بلوجر.
عندما ننشر معلومات حول مواصفات المنتج ، ومراجعة المنتج ، وبعض المحتوى مقابل المحتوى ، فإننا ننشئ جدولاً في مشاركة Blogger.

• معاينة 1
• معاينة 2

المرحلة الأولى:
يجب اتباع الخطوات التالية:
الخطوة 1: انتقل إلى صفحات أو مشاركات Blogger وانقر على تحرير أي منشور أو صفحة.
جعل الجدول في بلوجر مثلا مشاركة 1
الخطوة 2: الآن انقر فوق زر HTML والصق الرمز في منطقة HTML ثم انقر فوق زر التحديث. استبدال المحتوى الخاص بك .

<table>
<tbody>
<tr>
<th>عنوان 1</th>
<th>عنوان 2</th>
<th>عنوان 3</th>
</tr>
<tr>
<td>جدول A</td>
<td>جدول B</td>
<td>جدول C</td>
</tr>
<tr>
<td>بلوجر</td>
<td>ووردبريس</td>
<td>جوملا</td>
</tr>
<tr>
<td>CSS3</td>
<td>HTML5</td>
<td>Javascript</td>
</tr>
<tr>
<td>المسيرة</td>
<td>سكريبت</td>
<td>تكويد</td>
</tr>
</tbody>
</table>

المرحلة الثانية:
الخطوة 3: الآن انتقل إلى مضهر Blogger على زر "تخصيص". أوضع الكود مباشرة قوق وسم: ]]></b:skin>
لجعل الجدول في مشاركات بلوجر أو في أي مكان
الخطوة 4: هنا انقر فوق خيارات متقدمة وقم بالتمرير لأسفل الخيار ثم انقر فوق إضافة CSS وقم بلصق رمز CSS هنا ثم انقر فوق الزر تطبيق على المدونة.

table {
color:#333;
font-family:Helvetica,Arial,sans-serif;
width:100%;
border-spacing:1px;
border-collapse:separate;
padding:0 3px;
}
td, th {
height:30px;
transition:all .3s;
text-align:center;
width:auto;
}
th {
background:#B1B6AF;
font-weight:700;
border-radius: 5px;
}
td {
background:#FAFAFA;
}
tr:nth-child(even) td {
background:#F1F1F1;
}
tr:nth-child(odd) td {
background:#E1DDDD;
}
tr td:hover {
background:#666;
color:#FFF
}

الخطوة 5: الآن افتح مدونة Blogger.
وهكذا نكون قد انتهينا من درس اليوم من كيفية إنشاء جدول اخترافي متجاوب في مدونات بلوجر مثل مدونة المسيرة
إذا وجدت صعوبة في الجول الأول يمكنك استخدام الجول الثاني وهو أسهل:

<table border="2" cellpadding="2" cellspacing="2" style="width: 100%px;"><tbody>
<tr><th>عمــود رقم 1</th><th>عمــود رقم 2</th></tr>
<tr><td>فراغ العمود 1</td><td>فراغ العمود 2</td></tr>
<tr><td>فراغ العمود 1</td><td>فراغ العمود 2</td></tr>
<tr><td>فراغ العمود 1</td><td>فراغ العمود 2</td></tr>
<tr><td>فراغ العمود 1</td><td>فراغ العمود 2</td></tr>
<tr><td>فراغ العمود 1</td><td>فراغ العمود 2</td></tr>
<tr><td>فراغ العمود 1</td><td>فراغ العمود 2</td></tr>
<tr><td>فراغ العمود 1</td><td>فراغ العمود 2</td></tr>
<tr><td>فراغ العمود 1</td><td>فراغ العمود 2</td></tr>
<tr><td>فراغ العمود 1</td><td>فراغ العمود 2</td></tr>
<tr><td>فراغ العمود 1</td><td>فراغ العمود 2</td></tr>
<tr><td>فراغ العمود 1</td><td>فراغ العمود 2</td></tr>
<tr><td>فراغ العمود 1</td><td>فراغ العمود 2</td></tr>
<tr><td>فراغ العمود 1</td><td>فراغ العمود 2</td></tr>
<tr><td>فراغ العمود 1</td><td>فراغ العمود 2</td></tr>
<tr><td>فراغ العمود 1</td><td>فراغ العمود 2</td></tr>
<tr><td>فراغ العمود 1</td><td>فراغ العمود 2</td></tr>
<tr><td>فراغ العمود 1</td><td>فراغ العمود 2</td></tr>
<tr><td>فراغ العمود 1</td><td>فراغ العمود 2</td></tr>
<tr><td>فراغ العمود 1</td><td>فراغ العمود 2</td></tr>
<tr><td>فراغ العمود 1</td><td>فراغ العمود 2</td></tr>
<tr><td>فراغ العمود 1</td><td>فراغ العمود 2</td></tr>
</tbody></table>