مكتبة الفيديو

Tatweerweb.Co Fans on Facebook

السبت، 10 ديسمبر 2011

طريقة تنسيق صندوق التعليقات في مدونة بلوجر بتقنية ال css

السلام عليكم ورحمة الله وبركاتة ... معظمنا ان لم يكن كلنا قد اصابه الملل والفتور من صندوق تعليقات منصة بلوجر و اتجه الكثير من المدونين الي بعض المواقع المعروفه والتي تقدم خدمة تضمين التعليقات مع التحكم فيها ومراقبتها واتاحة مظهر جميل وانيق قد يفوق في بعض الاحيان منصة وردبريس وبرامج ادارة المحتوى الاخرى مثل جملا وخلافه .. في اضافة اليوم سنتعلم معا كيف نجعل من صندوق تعليقات بلوجر صندوقا احترافيا يبهر القارئ ويستفزه لتجربتة بكتابة تعليق علي التدوينه التي انتهي من قرائتها ... لمشاهدة مثال حى علي درس اليوم يمكنك النزول الي الاسفل ورؤية صندوق التعليقات الخاص بمدونتي تقارب ان اعجبك وتود تطبيق المثل قم باتباع ما بالاسفل .
  1. سجل دخول الي لوحة تحكم مدونة بلوجر .. ثم اذهب الي تصميم ثم الي تحرير HTML ثم اضغط على توسيع فوالب عناصرواجهة المستخدم ..
  2. ثم ابحث عن :
<div class='comment-form'>
      : واستبدلها بـ 
 <div id='mbt-form'> 
   3.  ابحث عن :
]]></b:skin>

واضف قبلها مباشرة هذا الكود :


#mbt-form iframe{
background:#ffffff url(http://farm5.static.flickr.com/4020/4647821870_28f1634a7d_t.jpg) no-repeat bottom right;
border:7px solid #ABABAB;
padding:5px;
font:normal 13pt "tahoma;
color:#ABABAB;
width:450px;
}
#mbt-form iframe:hover{
background:#ffffff url(http://farm4.static.flickr.com/3340/4647190659_cd0b1c00f2_t.jpg) no-repeat bottom right;
border:7px solid #3b5897;
}
#mbt-form a{
color:#3b5897;


بعد الانتهاء قم بحفظ قالب المدونة .
___________________________________________________________________

طريقة تعديل الكود بما يتناسب مع قالب مدونتك  :

1. لون وخلفية الصندوق قبل كتابة التعليق .

#mbt-form iframe
قم بالبحث عن الكود الصغير الذي بالاعلى وهو المسؤول عن شكل الصندوق قبل كتابة التعليق وابحث داخله عن الاتي :

background : لتغيير لون الخلفية باضافة كود للون المراد  او اضافة رابط صورة ليظهر في الخلفية .
                ملاحظة : اذا اردت استخدام لون في الخلفية فقط ، احذف هذا من الكود url(http://farm5.static.flickr.com/4020/4647821870_28f1634a7d_t.jpg) no-repeat bottom right;

border: لتحديد حجم الاطار الخارجي ولونه في صندوق التعليق بتغيير القيمة 7 وتغير كود اللون #ABABAB بكود اللون الذي تريده

padding : لتحديد بعد الحدود عن نموذج المشاركة (يرجى عدم تغييرها)

font : حجم خط كلمة " التعليق باسم" ونوعه في نموذج المشاركة ، تستطيع تغيير القيمة 13 لتكبير او تصغير الخط ، وتغيير كلمة tahoma بخط اخر تريده .

color : لون خط كلمة " التعليق باسم" في نموذج المشاركة
width : عرض الصندوق ، تستطيع تغير العرض ليتناسب مع مدونتك .


2.  تخصيص الصندوق عند مرور الفارة عليه :

 #mbt-form iframe:hover


كما هو شرح  الخطوات السابقة ولكن الفرق هو عند مرور الفأرة على صندوق التعليق .


3.  لون الروابط في صندوق التعليقات .

#mbt-form a


تحديد لون الروابط " تسجيل خروج" و " الاشتراك عن طريق البريد الالكتروني "



4.  تذكر انت غير مقيد بشكل الكود  .

تستطيع ان تخصص هذا الكود وتصمم الصور التي تريد ان تعرض ، فقط قم بتغيير الروابط داخل الكود الاول بروابط الصور الخاصة بك .

لأي استفسار اترك تعليق
المصدر : مدونة سما بلوجر بتصرف بسيط

 

يسمح لكم بنقل الموضوع بشرط ذكر المصدر : طريقة تنسيق صندوق التعليقات في مدونة بلوجر بتقنية ال css | TATWEERWEB
 
ساهم في نشر الموضوع ولك جزيل الشكر !

أضف تعليقك عن طريق الفيسبوك :
اضافات بلوجر, تنسيق القالب, تنسيق تعليقات

التعليقات :

Hareth Arabiyat
15 أبريل 2012 في 4:48 م

أخي الكريم أحمد لقد ضهر لي كودين من من أول كود في الخطوة الأولى ماذا أفعل

Best Blogger Tips
3rby
5 أغسطس 2012 في 1:17 م

يعطيك العافية اخي الكريم على الشرح

http://3rbyblog.blogspot.com

Best Blogger Tips

إرسال تعليق

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