الأحد، 13 يونيو 2010

شرح إضافة 3 أعمدة في الفوتر لمدونات بلوجر

شرح إضافة 3 أعمدة في الفوتر لمدونات بلوجر . زواري الكرام الأعزاء درسنا اليوم هو عبارة عن شرح إضافة 3 أعمدة في الفوتر لمدونات بلوجر . وقد أردت شرحه بعد أن جائتني بعض الاستفسارات بخصوص هذه الإضافة لقوالب بلوجر فأبدأ والله المستعان ؛؛
1. ادخل الى لوحة التحكم ثم الى تصميم ثم تحرير ال HTML ثم قم بتوسيع القالب .

2. قم بأخذ نسخة احتياطية من القالب خاصتك .
3. قم بالبحث عن هذا الكود
<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>
وقم باستبداله بهذا الكود

<div id='footer-column-container'>

<div id='footer2' style='width: 30%; float: left; margin:0; text-align: left;'>

<b:section class='footer-column' id='col1' preferred='yes' style='float:left;'/>
</div>

<div id='footer3' style='width: 40%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col2' preferred='yes' style='float:left;'/>
</div>

<div id='footer4' style='width: 30%; float: right; margin:0; text-align: left;'>

<b:section class='footer-column' id='col3' preferred='yes' style='float:right;'/>
</div>

<div style='clear:both;'/>

<div id='footer-bottom' style='text-align: center; padding: 10px; text-transform: lowercase;'>

<b:section class='footer' id='col-bottom' preferred='yes'>
<b:widget id='Text2' locked='false' title='' type='Text'/>
</b:section>

</div>
<div style='clear:both;'/>

</div>
 ثم قم بعمل استعراض للقالب . عند عدم وجود أية أخطاء تابع معي لابد من إضافة هذا الكود لتظبيط ال CSS
قم بالبحث عن </b:skin>
 وقم  بإدراج هذا الكود قبله مباشرة 
#footer-column-container {
clear:both;
}

.footer-column {
padding: 10px;
}
الآن احفظ القالب واذهب الى لوحة التحكم ثم التصميم ثم عناصر الصفحة .. ستجد أن ال 3 أعمدة تم إدراجهم في القالب .
ملحوظة هامة :  شكل الأعمدة يعتمد على شكل قالبك الخاص .
تم بحمد الله .. تحياتي أخوكم : باسم

2 التعليقات:

اياد يقول...

جزاك الله خيرا على الشرح

Basem يقول...

@اياد العفو أخ أياد

إرسال تعليق