Friday, 16 August 2013

CSS Komentar Blogger Seperti Komentar Google+

CSS Komentar Blogger Seperti Komentar Google+

CSS Komentar Blogger Seperti Komentar Google+ - Pasti kalian sudah pernah melihat/memakai komentar google plus kan? sekarang saya mau berbagi "CSS Komentar Blogger Seperti Komentar Google+" sepertinya css ini sangat menarik untuk digunakan dan yang pastinya CSS Komentar ini seperti Komentar Google+.
Cara pemakaiannya cukup mudah, hapus semua CSS Komentar Blogger yang anda pasang, lalu anda ganti dengan CSS Komentar ini
.comments{border:1px solid #ccc}
.comments .comment-block{margin-left:90px}
.comments .comments-content .user{    color:#262626;         font-style:normal;     font-weight:bold; font-size:13px; font-family:arial}
.comments .comment-replybox-thread{    margin-left:20px;     margin-top:5px}
.comments .comments-content .comment-content{    color:#262626;     font-family:arial; padding-right:25px; font-size:13px; text-align:left}
.comments .comments-content .comment{border-bottom:1px solid #EEE}
.comments .comments-content .comment-header, .comments .comments-content .comment-content{    margin:0}
.comments .comments-content .icon.blog-author{background:url(//2.bp.blogspot.com/-fGqHghV17sw/TyIzFNGl_uI/AAAAAAAAAQY/XpDDAI1dJ3o/s320/author.png) no-repeat;}
.comments .comments-content .datetime{    color:#999;     font-family:arial;     font-size:11px;     margin-left:6px}
.comments .comments-content .datetime a:link{color:#999}
.comments .comments-content .datetime a:visited{color:#999}
#comments h4{  background:none repeat scroll 0 0 #EEE;     color:#262626;     font-size:16px;     padding-bottom:25px;     padding-left:25px;     padding-top:25px; font-style:normal; font-family:arial}
#comments-block dt{  margin:.5em 0}
#comments-block dd{  margin:.25em 0 0}
#comments-block dd.comment-footer{  margin:-.25em 0 2em;   line-height:1.4em;   font-size:78%;     display:none}
#comments-block dd p{  margin:0 0 .75em}
.comment-form{clear:both;     margin-left:20px;     margin-top:-60px; width:550px}
.comments .avatar-image-container img{    max-width:50px}
.comments .avatar-image-container{    float:left;     max-height:50px;     overflow:hidden;     width:50px}
.avatar-image-container{    background:url("//ssl.gstatic.com/s2/profiles/images/silhouette46.png") repeat scroll 0 0 / 100% auto transparent;  border-radius:50px 50px 50px 50px; -moz-border-radius:50px 50px 50px 50px;  -webkit-border-radius:50px 50px 50px 50px;  color:#FFF;  display:block;  float:left;  font-size:20px;  height:50px;  margin-left:20px;  text-align:center;  width:50px}
.comments .avatar-image-container img{ width:50px}
#comments-block.avatar-comment-indent{ margin-left:4px;  position:relative}
ol #comments-block li{ border-bottom:1px solid #EEE;  list-style:none;  margin:20px 0;  z-index:-100; min-height:90px}
#comments-block .comment_content{ width:500px}
.deleted-comment{ font-style:italic;  color:gray}
nah, jika sudah anda terapkan, silahkan anda save.
ok cukup sampai sini dulu, karna dah malem, semoga artikel ini bermanfaat / berguna untuk anda.

Code by : TheMasDoyok

Seorang pelajar yang ingin berkreatifitas di dunia blogging dan yang selalu ingin membuat kreatifitas yang lebih baru.

10 komentar

wah keren :3 ijin praktekin ya tapi ribet dah kayanya :v

commentback ya dah tau kan blog gw? \:v/

hohoho keren, kalo ditambahin border disetiap komen pasti lebih keren :3

Wawww spertinya keren nihhh gannn ..........
tak coba dulu ye gann

itu ga ada htmlnya dan ?? mau coba takut salah :3

HTML ? itu kan CSS komentar, ya kalo lu pasang pasti langsung keubah sendiri, HTML komentar udah ada dari sononya kali.

Catatan :
- Dilarang Menggunakan Link Aktif / Live Link
- Dilarang Promosi Iklan
- Dilarang Nyepam
- Untuk Menyisipkan Kode, Gunakan tag <i rel='code'> Taruh Kode Disini </i>
- Untuk Menyisipkan Kode Panjang, Gunakan tag <i rel='pre'> Taruh kode panjang disini </i>
- Untuk Menyisipkan Catatan, Gunakan <b rel='quote> Taruh Catatan disini </b>
- Untuk Menyisipkan Gambar, Gunakan <i rel="'image> URL Gambar </i>
- Untuk Menyisipkan Youtube, Gunakan <i rel='youtube'> URL Youtube </i>

Sebelum menyisipkan kode silahkan gunakan Tools Konversi Kode.
Caranya tinggal klik tombol "Konversi Kode" yang berada di Form Komentar.
EmoticonEmoticon