تغيير شكل تعليقات بلوجر الى شكل اكثر جمالاً

مرحباً بكم اصدقائي وزوار مدونتي على بلوجر


الكثير منكم يعاني من مشكلة ان التعليقات ليست جميلة ولا تجذب الزوار ..

نعم فللتعليقات مكانة في جذب الزوار الى المدونة 

ولهذا قررنا ان نضع بين يديكم شرح لتغيير التعليقات لشكل جميل جداً 
تغيير شكل تعليقات بلوجر الى شكل اكثر جمالاً

الصورة


تغيير شكل تعليقات بلوجر الى شكل اكثر جمالاً




طريقة التركيب

اذهب الى لوحة التحكم ثم قالب ثم تحرير HTML
ابحث عن 
]]></b:skin>


وضع الكود التالي فوقة 


.comments{clear:both;margin-top:10px;margin-bottom:0;font-family:Arial;line-height:18px;font-size:13px}

.comments .comments-content{margin-bottom:16px;font-weight:normal;text-align:right}
.comments .comment .comment-actions a,.comments .comment .continue a{display:inline-block;margin:0 0 10px 10px;padding:0 15px;color:#424242 !important;text-align:center;text-decoration:none;background:#fede72;border:1px solid #fec648;border-radius:2px;height:26px;line-height:28px;font-weight:normal;cursor:pointer}
.comments .comments-content .comment-thread ol{list-style-type:none;padding:0;text-align:none}
.comments .comments-content .inline-thread{padding:0}
.comments .comments-content .comment-thread{margin:8px 0}
.comments .comments-content .comment-thread:empty{display:none}
.comment-replies{margin-top:1em;margin-right:40px;background:#fff}
.comments .comments-content .comment{margin-bottom:0;padding-bottom:0}
.comments .comments-content .comment:first-child{padding-top:16px}
.comments .comments-content .comment:last-child{border-bottom:0;padding-bottom:0}
.comments .comments-content .comment-body{position:relative}
.comments .comments-content .user{font-style:normal;font-weight:normal}
.comments .comments-content .user a{color:#0E6284;font-weight:normal;text-decoration:none}
.comments .comments-content .icon.blog-author{width:18px;height:18px;display:inline-block;margin:0 0 -4px 6px}
.comments .comments-content .datetime a{color:#0E6284;font-size:12px;float:left;text-decoration:none}
.comment-content{margin:0 0 8px;padding:0 5px}
.comment-header{font-size:18px;background-color:#f1f1f1;border-bottom:1px solid #e3e3e3;padding:5px}
.comments .comments-content .owner-actions{position:absolute;left:0;top:0}
.comments .comments-replybox{border:none;height:230px;width:100%}
.comments .comment-replybox-thread{margin-top:0}
.comments .comment-replybox-single{margin-top:5px;margin-right:48px}
.comments .comments-content .loadmore a{display:block;padding:10px 16px;text-align:center}
.comments .thread-toggle{cursor:pointer;display:inline-block}
.comments .comments-content .loadmore{cursor:pointer;max-height:3em;margin-top:0}
.comments .comments-content .loadmore.loaded{max-height:0;opacity:0;overflow:hidden}
.comments .thread-chrome.thread-collapsed{display:none}
.comments .thread-toggle{display:inline-block}
.comments .thread-toggle .thread-arrow{display:inline-block;height:6px;width:7px;overflow:visible;margin:0.3em;padding-left:4px}
.comments .thread-expanded .thread-arrow{background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAc AAAAHCAYAAADEUlfTAAAAG0lEQVR42mNgwAfKy8v/48I4FeA0AacVDFQBAP9wJkE/KhUMAAAAAElFTkSuQmCC") no-repeat scroll 0 0 transparent}
.comments .thread-collapsed .thread-arrow{background:url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA AcAAAAHCAYAAADEUlfTAAAAJUlEQVR42mNgAILy8vL/DLgASBKnApgkVgXIkhgKiNKJ005s4gDLbCZBiSxfygAAAAB JRU5ErkJggg==") no-repeat scroll 0 0 transparent}
.avatar-image-container{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhk9cMJZIckopDh26pvSOSHTjje1p5IEkTUoIsX2TBS_a7iLXwhB38rTczNObufFnZfbxEtu5BRrmBHUGS9et_RivYM7UeZDHMEysgI8ND97ACJ0t4YVDq45Aztk02BT86kUPxiNi5t14w/s51/arrow.png) top left no-repeat;float:right;vertical-align:middle;overflow:hidden;width:65px !important;height:51px !important;max-width:65px !important;max-height:51px !important}
.comments .avatar-image-container img{padding:2px;border:1px solid #ccc;width:45px !important;height:45px !important;max-width:45px !important;max-height:45px !important}
.comments .comment-block{margin-right:65px;position:relative;border:5px solid #e3e3e3;border-radius:8px}
@media screen and (max-device-width:480px){.comments .comments-content .comment-replies{margin-right:0}}


اضغط حفظ 

ومبرووووك 


اتمنى ان الدرس نال اعجابكم درس تغيير شكل تعليقات بلوجر الى شكل اكثرجمالاً
ساهم بنشر المدونة اكثر واكثر 

ليست هناك تعليقات:

إرسال تعليق

تقنيات الانترنت تصميم محمد بقلوله جميع الحقوق محفوظة 2014

صور المظاهر بواسطة sndr. يتم التشغيل بواسطة Blogger.