برمجه لتزين التعليقات من الزوار بالمدونه Blogger Threaded Comments 3 اشكال

برمجه الردود بالبلوجر مميز بالصوره Comment blogger
المصدر
add this CSS:
البحث : ووضعه فوق
Just above

]]></b:skin>
.comments .comment-block { background: #F9F9F9; color: #555; box-shadow: 0 4px 10px #EEEEEE;position: relative; margin-top: 10px; margin-left: 60px; padding: 10px; border: 4px solid #EEEEEE !important; border-radius:10px; font: 1.190em/1.2 Cambria,Georgia,sans-serif; } .comment-thread li .comment-block:before { position: absolute; display: block; left: -26px; color: #EEEEEE; content: "\25C4"; font-size: 30px; } .comments .avatar-image-container { width: 60px; height: 60px; max-height: 60px; margin:0px 0px 0 -28px; padding: 0px; border: 7px solid #EEEEEE; border-radius:60px;} .comments .avatar-image-container img { overflow:hidden; width: 60px; height: 60px; max-width: 60px; border:0 !important; border-radius:60px; } .comments .comment-thread.inline-thread {background: none; } .comments .continue { border-top: 0px solid transparent; } .comments .comments-content .datetime { float: right; font-size: 11px; } .comments .comments-content .user a{ font-size: 15px; color: #498EC9; } .comments .comments-content .datetime a:hover{ color: #777;text-decoration: none; } .comments .comments-content .comment:first-child { padding-top: 0px; }.comments .comments-content .comment { margin-bottom: 0px; padding-bottom: 0px; } .comments .continue a { padding: 0px; } .comments .comments-content .icon.blog-author { background-image: none; }
الشكل الثاني

.comment-thread ol { counter-reset: countcomments; } .comment-thread li:before { content: counter(countcomments,decimal); counter-increment: countcomments; float: right; z-index: 2;position:relative; font-size: 22px; color: #555555; padding-left:10px;  padding-top:3px; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhdfv9jdgwPNLq3HkvuJGAQ0nNf2siTPlqzZQqK35oDnJHe528WntFESa3KlFPLACVhdTQ1I7dOhAHdrykNlC4KWiW0lOgZSbHxQ1XjNHkvEOMnHSFQYcRdYaQHOlflRceOrvi7sW93fM3z/s1600/comment+bubble2.png) no-repeat; margin-top:7px;  margin-left:10px;  width: 50px; /*image-width size*/ height: 48px; /*image-height size*/  } .comment-thread ol ol { counter-reset: contrebasse; } .comment-thread li li:before { content: counter(countcomments,decimal) "." counter(contrebasse,lower-latin); counter-increment: contrebasse; float: right; font-size: 18px;color: #666666; }
الشكل الثالث
.comment-block { background:#F9F9F9; /* Background Color */ border: 1px solid #f1f1f1; /* Border style */ margin-bottom:20px; -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .4); -moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .4); box-shadow: 0 1px 2px rgba(0, 0, 0, .4); -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px;  } .comments .comment-thread.inline-thread {background-color: #FAFAFA; /* Background color behind the replies */ border-left: 4px dotted #E6E6E6; /* Border on the left side of replies */ } .comment-content { padding:2px 10px 10px 10px;color:#444444; /* Font Color in Comments */ } .datetime a { font-style:italic; font-size:9px;margin-left: 2px; } .comments .comments-content .user a{ color:#1982D1; /* Author's name color */font-size: 12px; /* Author's name size */ padding-left: 10px; font-weight:bold; text-decoration:none; } .comments .comment .comment-actions a,.comments .comment .continue a{display:inline-block;  margin:0 0 10px 10px; padding:0 15px; color:#B4B4B7; text-align:center;text-decoration:none; background:#F8F8FB; border:1px solid #C2C2C5; border-radius:4px;height:20px; line-height:20px; font-weight:normal; cursor:pointer; } .comments .continue { border-top: 0px solid #000; } .comments .comments-content .icon.blog-author { background-image: none;margin-left: -10px; } .comments .avatar-image-container{ margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; width: 40px; max-height: 40px; border: 1px solid #F2F2F2; padding: 1px; } .comments .avatar-image-container img{ margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px; max-width: 40px;height: 40px; }
 

تابع هنا

هنا

هنا
المصدر
وسلامتكم

إرسال تعليق

0 تعليقات