Post Top Ad

Your Ad Spot

السبت، 25 يناير 2014

تغيير شكل تعليقات بلوجر الأفتراضى الى شكل اخر احترافى الشكل الثالث CSS Comments

غير شكل تعليقات بلوجر الأفتراضية الى شكل اخر جذاب مثل المواقع الكبرى لتعطى شكل افضل للمدونة لتجذب الزوار والمشاركين على التعليقات فالاضافة او التغيير بتقنية css اللغة الأكثر من رائعة الذى اعطت الروح والحياه للغة Html فلن اطيل عليكم بالكلام ونأتى الى طريقة التركيب







مثال التغير من خلال الصورة التالية :

طريقة تركيب الأضافة :

قبل اضافة اى اكواد يجب اخذ نسخة احتياطية قبل وضع اى اكواد ومن هنا درس بسيط يعلمك طريقة اخذ نسخة احتياطية الان ناتى الى الطريقة فى البداية ادخل الى لوحة تحكم مدونتك ومن بعدها اضغط على القالب الأن اضغط على تحرير HTML

الان قم بالبحث عن هذا الكود :
]]></b:skin>
اضف فوقة مباشرة هذا الكود :

.comments .comment .comment-actions a {
background: none repeat scroll 0 0 #FF5050;
border: 2px solid #000000;
border-radius: 3px 3px 3px 3px;
color: #000000;
font: bold 12px arial;
margin-right: 14px;
padding: 3px 9px;
text-decoration: none !important;
text-shadow: 1px 1px 0 #FFFFFF;
}
.comments .comment-block {
background: none repeat scroll 0 0 #E2E2E2;
border: 4px solid #ABABAB;
border-radius: 3px 3px 3px 3px;
padding: 3px 10px;
}
.continue a {
background: none repeat scroll 0 0 #FF5050;
border: 2px solid #000000;
border-radius: 3px 3px 3px 3px;
color: #000000 !important;
display: inline-block !important;
margin-top: 7px;
padding: 3px 8px !important;
text-decoration: none !important;
text-shadow: 1px 1px 0 #FFFFFF;
}
.comment-block:hover > .comment-header {
border-bottom: 2px solid #000;
-moz-transition: border-color .5s ease;
}
.comment-header a {
color: #000000 !important;
}
#comments .avatar-image-container img {
border: 1px solid #FFFFFF !important;
border-radius: 34px 34px 34px 34px;
height: 45px;
max-width: 45px;
}
.comments .avatar-image-container {
border: 1px solid #FFFFFF;
border-radius: 34px 34px 34px 34px;
box-shadow: 1px 1px 3px #ABABAB;
float: right;
margin-right: -5px;
max-height: 45px !important;
overflow: hidden;
width: 45px !important;
}
بالأخير قم بالضغط على زر حفظ التغيرات وانتهى التركيب 
ملحوظة هامة :
لمن يواجهة مشكلة بعدم نجاح التغيرات او عدم نزول زر الرد او عدم التنسيق فقط اضغط على هذا الدرس الضرورى الذى سيحل لك هذا المشاكل .


بعض الأشكال السابقة قد تعجبك :
الشكل الأول :
الشكل الثانى:
بالنهاية ارجو بأن هذه التدوينة اعجبتكم .

هناك تعليق واحد:

قال تعالى ( مَا يَلْفِظُ مِن قَوْلٍ إِلا لَدَيْهِ رَقِيبٌ عَتِيدٌ )

Post Top Ad