Cara Membuat Komentar Blogger Seperti Facebook
Space Iklan Disini, silahkan Hubungi kami !
Tutorial kali ini tentang komentar Blogger menyerupai Facebook, dengan penambahan kode CSS. Kode CSS ini dipersembahkan oleh hompimpaalaihumgambreng, dan saya edit sedikit dengan menghilangkan garis pinggir dan perubahan padding-left dan padding right.
Cara Membuat Komentar Blogger Seperti Facebook
1. Login ke Blogger2. Klik Template --> Edit HTML
3. Cari kode
]]></b:skin>4. Tambahkan kode ini diatas
]]></b:skin>
/* CSS Komentar Blogspot - Tema Facebook
*/
.comments {
font:normal 11px/14px "Lucida Grande",Tahoma,Verdana,Arial,Sans-Serif !important;color:rgb(51,51,51);
}
.comments .comments-content a {color:#3B5998 !important;}
.comments h2, .comments h3, .comments h4 {
font-family:"Lucida Grande",Tahoma,Verdana,Arial,Sans-Serif !important;
font-size:16px;}
.comments .comments-content .comment {
margin:0 0 0;
padding:10px 0px 10px 0px;
border-top:1px solid #e9e9e9;
border-left:none;
}
.comments .comment .comment-header,
.comments .comment .comment-actions,
.comments .comment .comment-actions a,
.comments .comment .comment-thread.inline-thread,
.comments .comment .continue {margin:0 0 0; padding:0 0 0; border:none; background:transparent;}
.comments .comment .comment-header {margin-bottom:4px;}
.comments .comment .comment-header .datetime a {color:#808080 !important;}
.comments .comment .comment-actions a {padding-right:5px;}
.comments .thread-toggle .thread-arrow {width:7px; height:7px; padding-right:4px}
.comments .comment .avatar-image-container,
.comments .comment .avatar-image-container img {
width:50px;
height:50px;
max-width:none;
max-height:none;
border:none;
padding:0;
margin:0;
outline:none;
}
.comments .comment .comment-block {margin:0 0 0 60px !important;}
.comments .comment .comment-thread.inline-thread {margin:7px 0 0 22px;}
.comments .comment .comment-thread.inline-thread ol {margin:7px 0 10px !important;}
.comments .comment .comment-thread.inline-thread .comment {
background-color:#EDEFF4;
padding:5px 5px 0;
margin:1px 0 0;
border:none;
border-bottom:1px solid #D2D9E7;
}
.comments .comment .comment-thread.inline-thread .comment .avatar-image-container,
.comments .comment .comment-thread.inline-thread .comment .avatar-image-container img {width:32px;height:32px;}
.comments .comment .comment-thread.inline-thread .comment .comment-block {
margin:0 0 0 40px !important;}
.comments .comment .comment-content {text-align:left;}
.comments .comments-content .icon.blog-author {
width:16px;
height:16px;
display:inline-block;
vertical-align:top;
background:transparent url('/favicon.ico') no-repeat 50% 50%;}
.comments .comment .comment-thread.inline-thread .comment:last-child {
border-left:2px solid #A8B2CE !important;
}
*/
.comments {
font:normal 11px/14px "Lucida Grande",Tahoma,Verdana,Arial,Sans-Serif !important;color:rgb(51,51,51);
}
.comments .comments-content a {color:#3B5998 !important;}
.comments h2, .comments h3, .comments h4 {
font-family:"Lucida Grande",Tahoma,Verdana,Arial,Sans-Serif !important;
font-size:16px;}
.comments .comments-content .comment {
margin:0 0 0;
padding:10px 0px 10px 0px;
border-top:1px solid #e9e9e9;
border-left:none;
}
.comments .comment .comment-header,
.comments .comment .comment-actions,
.comments .comment .comment-actions a,
.comments .comment .comment-thread.inline-thread,
.comments .comment .continue {margin:0 0 0; padding:0 0 0; border:none; background:transparent;}
.comments .comment .comment-header {margin-bottom:4px;}
.comments .comment .comment-header .datetime a {color:#808080 !important;}
.comments .comment .comment-actions a {padding-right:5px;}
.comments .thread-toggle .thread-arrow {width:7px; height:7px; padding-right:4px}
.comments .comment .avatar-image-container,
.comments .comment .avatar-image-container img {
width:50px;
height:50px;
max-width:none;
max-height:none;
border:none;
padding:0;
margin:0;
outline:none;
}
.comments .comment .comment-block {margin:0 0 0 60px !important;}
.comments .comment .comment-thread.inline-thread {margin:7px 0 0 22px;}
.comments .comment .comment-thread.inline-thread ol {margin:7px 0 10px !important;}
.comments .comment .comment-thread.inline-thread .comment {
background-color:#EDEFF4;
padding:5px 5px 0;
margin:1px 0 0;
border:none;
border-bottom:1px solid #D2D9E7;
}
.comments .comment .comment-thread.inline-thread .comment .avatar-image-container,
.comments .comment .comment-thread.inline-thread .comment .avatar-image-container img {width:32px;height:32px;}
.comments .comment .comment-thread.inline-thread .comment .comment-block {
margin:0 0 0 40px !important;}
.comments .comment .comment-content {text-align:left;}
.comments .comments-content .icon.blog-author {
width:16px;
height:16px;
display:inline-block;
vertical-align:top;
background:transparent url('/favicon.ico') no-repeat 50% 50%;}
.comments .comment .comment-thread.inline-thread .comment:last-child {
border-left:2px solid #A8B2CE !important;
}
5. Simpan Template
Congrats... komentar Blogger anda sudah berubah dengan gaya facebooksekian dulu Cara Membuat Komentar Blogger Seperti Facebook yang saya dapet dari blog.kangismet.net semoga share saya ini bermanfaat.
38 comments:
Keren tapi masihh bingung mau pake yang udah ada apa yang ini ya. soalnya sama-sama kerennya sob. thanks ya buat sharingnya
thanks atas infonya pal
maunya disertai beberapa sreenshot gan. hehe soalnya biar ane kebayang. ini maksudnya memansang komentar facebook atau cuma merubah tampilan komentar blog. kayaknya seru deh.. btw thanks ya gan :D
dihh.. demi apa.. ini yang banyak orang cari cari loh..
salam persahabatan :)
salam juga..
saya pilih yang biasa biasa aja.. :D
iya sobat, terserh sobat enak yang mana
waw..
ijin nyimpen dulu sob..
ntar kalau lagi butuh dikeluarin :D
oh iya sobat ganti template lagi ya ?
Pengen banget 'otak-atik' template...dan perlu waktu khusus neh kayaknya..TFS SOb,
@darmawan: enggak tuh sob, cuma di permanis aja templatenya.
Kelas blognya bung!!
Template begini yang simpel tapi cocok buat para blogger tutorial.
woy bung, kalo pake template orang jgn seenaknya aja, creditnya ngapain dihapus!!
saya terkesan, saya harus mengatakan ini kepada anda.
Sangat jarang saya menemukan sebuah blog yang informatif dan menghibur seperti ini.
Blog Anda sangat penting bagi semua orang, teruslah berbagi.
saya harus mengatakan bahwa secara keseluruhan saya benar-benar terkesan dengan blog ini
blog yang bagus dan informatif, yang berisi semua informasi dan juga memiliki dampak yang
besar pada teknologi baru. Terima kasih telah berbagi
Teruslah berbagi ide sampai masa mendatang .pada dasarnya apa yang saya cari sudah saya
temukan disini, dan saya senang sudah tiba disini.
Artikelnya sangat luar biasa menakjubkan sekali, di tunggu update selanjutnya yang lebih menarik dan bagus lagi
Terima kasih atas postingan yang fantastis.
foto ipin Sangat jarang saya menemukan sebuah blog yang informatif dan menghibur seperti ini
pasha ungu Terima kasih atas postingan yang bermanfaat.
games spongebob Postingan yang sangat bagus, saya setuju dengan Anda 100%!
profil mario teguh Terima kasih atas postingan yang bermanfaat.
manchester city vs chelsea saya terkesan, saya harus mengatakan ini kepada anda
video bokep Sangat jarang saya menemukan sebuah blog yang informatif dan menghibur seperti ini
palestina gaza Terima kasih atas postingan yang bermanfaat.
postingan anda sangat bermutu
jadwal liga inggris nanti malam
bisnis internet terimakasih atas postingannya
bambang. Saya menemukan banyak pengetahuan setelah mengunjungi postingan Anda terima kasih atas informasinya.
Foto Toket Artis Indonesia Tanpa Sensor. Teruslah berbagi ide sampai masa mendatang .pada dasarnya apa yang saya cari sudah saya temukan disini, dan saya senang sudah tiba disini.
Foto ABG Seksi Mau Ngentot Terbaru
Terima kasih atas postingan yang bermanfaat.
saya harus mengatakan bahwa secara keseluruhan saya benar-benar terkesan dengan blog ini.
gosip Karina Suwandi
eriska rein
Sangat jarang saya menemukan sebuah blog yang informatif dan menghibur seperti ini.
hasil pertandingan liga inggris tadi malam
Terima kasih atas postingan yang bermanfaat
walikota surabaya terimakasih atas postingannya
Janda Muda Cantik Ingin Dimanja (Hot!) saya harus mengatakan bahwa secara keseluruhan saya benar-benar terkesan dengan blog ini.
Sangat jarang saya menemukan sebuah blog yang informatif dan menghibur seperti ini.
Skandal SMU 1 Sindang
Post a Comment