الأحد، 19 مايو 2013

طريقة إضافة قسمين في السايدبار



كلنا رأينا قوالب تحتوي أكثر من عمود أو قسم في السايدبار adding two columns at blogger sidebar ولكن احيانا لا يكون القالب يعجبنا ولكن نحتاج لتلك الإضافة في قالب خاص خصوصا انا مفيده لكثير من المدونين في عرض وحدات إعلانية او اضافات صغيرة لا تحتاج عمود كامل ولهذا بإذن الله في هذا الدرس سنستطيع اضافة قسمين للسايدبار وسنضيف أيضا قسم ثالث بعد هاذين القسمين لزيادة التنسيق لكن يجب ان ننوه أن هذه الإضافة في الغالب ستعمل مع جميع القوالب لكن تنسيقها قد لا يتوافق مع جميع القوالب لذا قبل عمل أى تعديل قم باخذ نسخة احتياطية من قالبك لتجنب أى مشكلة

طريقة الإضافة


ادخل الى لوحة تحكم مدونتك ثم قم بالبحث عن آخر اضافة في السايدبار لديك يمكنك البحث عنها بالإسم 
ثم قم بالبحث تحت أكوادها عن هذا الكود </b:section> ملاحظة ان لم تجده قد تجد أسهم توسيع عناصر بجانب الإضافة اضغط عليها حتى تظهر جميع أكوادها وعندما تجد الكود أضف تحته مباشرة الأكواد التالية 
<b:section class='sidebar' id='cnmu-right-col' preferred='yes'/>
<b:section class='sidebar' id='cnmu-left-col' preferred='yes'/>
<b:section class='sidebar' id='cnmu-center-col' preferred='yes'/>
وهذه صورة للتوضيح


ثم بعد ذلك نبحث عن هذا الوسم sidebar-wrapper
والذي نقصده سيكون موجود في اكواد الستايل فقم بتوسعتها بالضغط على سهم التوسعة



عندما تجده ستجد بعده قوس فتح كهذا { ثم اكواد قليلة ثم قوس إغلاق كهذا }
بعد قوس الإغلاق أضف الأكواد التالية
#cnmu-right-col {
width:49%;
float:right;
word-wrap:break-word;
overflow:hidden;
}
#cnmu-left-col {
width:49%;
float:left;
word-wrap:break-word;
overflow:hidden;
}
#cnmu-center-col {
width:100%;
float:right;
word-wrap:break-word;
overflow:hidden;
}
ملاحظة : الأكواد المعلمة بالأحمر هي خاصة بالعمود الثالث الذي سيضاف بعد العمودين إن لم تريده قم بحذفهما




بعض القوالب تكون الوسوم بها متغيرة وقد لا تجد sidebar-wrapper
حينها ستفعل التالي
ابحث عن اول آضافة لديك في السايدبار وفوق اكوادها ستجد كود مثل هذا

<b:section class='sidebar' id='#'
الكود سكون مشابه وليس مطابق وفي مكان هذا الرمز # ستجد كلمة هذه الكلمة هي الوسم البديل لــ sidebar-wrapper
قم بنسخها وابحث عنها بين اكواد الستايل وعندما تجد الكود الخاص بها ستجد نفس الشئ قوس فتح وقوس اغلاق بعد قوس الإغلاق أضف الأكود
وبالتوفيق بإذن الله

المصدر : كن مدون

2 التعليقات:

ارسل لي هذا القالب على الايميل
newstnu@gmail.com

إرسال تعليق