تغير شكل التعليقات لشكل مدونة شعلة ويب | الأفضل لكم v1

Unknown 7:32 ص

بسم الله الرحمن الرحيم

مرحباً بزوار مدونة شعلة ويب الأفضل لكم

اليوم سأقدم لكم تغير التعليقات لشكل مدونة شعلة ويب v1 الأحترافية

شكل جميل ومن أهم المميزات يميز بين الأدمن والزائر

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

والحمده لله أكواد سهله جداً أنشاء الله

توجه إلى لوحة التحكم  ثم أختر قالب من القائمة الجانبة

ثم أبحث على !

]]></b:skin>

ثم ضع فوقها الكود التالى مباشرة

.comments a{color:#fff}
.comments a:hover{color:#fff;}
.comments .thread-toggle{
    display: inline-block;
    margin-bottom: 20px;
    border: #489CFF solid 2px;
    padding: 5px;
    text-align: center;
    border-radius: 25px;
    padding-left: 12px;
    line-height: 0px;
    padding-bottom: 7px;
}
.comments .thread-toggle:hover{background-color:#d35400;}
.comments .thread-toggle a{text-decoration:none;color:#000;}
.comments .thread-toggle:hover a{color:#fff;}
.comments .comment-block{
background-color:#d35400;
border-radius:25px;
padding:5px 60px 5px 20px;
color:#fff;
font-family: sans-serif;
text-align:right;
min-height: 140px;
}
.comments .avatar-image-container{    float: none;
    max-height: 100%;
    overflow: visible;
    width: 36px;
    border-radius: 50%;}
.avatar-image-container{background-color:#000;}
.comments .avatar-image-container img{
width:70px;
height:70px;
max-width:70px;
background-color:#000;
border-radius:50%;
float:right;
position:relative;
top:-30px;
right:15px;
z-index: 1;
}
.comments .comments-content .datetime a{
height:20px;
padding:5px;
background-color:#81CFE0;
float:left;
position: relative;
top: 0px;
opacity:0;
left: 30px;
transition:1s;
}
.comments .comment-block:hover .datetime a{
position: relative;
top: -30px;opacity:1;
transition:1s ease;
text-decoration:none;
}
.comments .comments-content .user{
font-size:20px;
position:relative;
right:0px;
font-weight:bold;
    padding-bottom: 5px;
}
.comments .comments-content .user a{color:#fff;}
.comments .comments-content .user a:hover{text-decoration:none;}
.comment-header{}
.comments .comment .comment-actions a, .comments .comment .continue a{
width:70px;
height:30px;
border:#fff solid 2px;
line-height: 28px;
text-align: center;
border-radius:25px;
float:left;
margin-left:5px;
cursor:pointer;
}
.comments .comment .comment-actions a:hover{
background-color:#fff;
color:#489CFF;
text-decoration:none;
}
.comments .comments-content .comment-content{
height: 50px;
    overflow-y: auto;
    padding-left: 5px;
}
.comments .comments-content .icon.blog-author{
    background-color: #489CFF;
    border-radius: 50%;
    height: 15px;
    width: 20px;
    z-index: 1;
    position: absolute;
    right: 20px;
    top: 5px;
    border: #489CFF solid 4px;
transition:1s;background-repeat: no-repeat; background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAAXNSR0IArs4c6QAAAAZiS0dEAP8A/wD/oL2nkwAAAAlwSFlzAAALEgAACxIB0t1+/AAAAAd0SU1FB9sLFwMeCjjhcOMAAAD+SURBVDjLtZSvTgNBEIe/WRRnm3U8RC1neQdsm1zSBIU9VVF1FkUguQQsD9ITmD7ECZIJSE4OZo9stoVjC/zc7ky+zH9hXwVwDpTAWWLrgS3QAe8AZgaAJI5zYAmc8r0G4AHYHQKVwII8PZrZFsBFkeRCABYiMh9BRUhnSkPTNCtVXYXURi1FpBDgArj8QU1eVXUzfnjv7yP7kwu1mYrkWlU33vs1QNu2qU8pwN0UpKoqokjWwCztrMuBhEhmh8bD5UDqur75asbcX0BGUB9/HAMB+r32hznJgXy2v0sGLBcyAJ1EK3LFcbo1s91JeLwAbwGYu7TP/3ZGfnXYPgAVNngtqatUNgAAAABJRU5ErkJggg==);
}

وإلى هنا أنتهت تدوينتنا أتمنى أن تكون شكل التعليقات أعجبتكم أنتظرونا فى تدوينة أخرى أنشاء الله