Cara Merubah Tampilan Kotak Komentar Blogger Seperti Facebook


Assalamualaikum wr.wb sobat blogger, pada kesempatan kali ini Kang Aluha akan memberikan tutorial blogger mengenai cara merubah / membuat tampilan komentar blogger seperti komentar Facebook. Sebelumnya Anda harus mengganti komentar blog Anda dengan blogger threaded comment atau tampilan komentar baru blogger dengan fitur reply otomatis, jika sudah maka Anda bisa mengikuti panduan mengenai cara merubah tampilan komentar seperti Facebook.

Dengan merubah tampilan blogger seperti Facebook ini akan menghasilkan komentar blogger menjadi lebih elegan dan keren juga enak untuk dilihat. Cara penerapannya pun cukup mudah, karena Anda hanya menambahkan CSS kedalam template blogger Anda. Nah jika Anda ingin mencoba untuk merubah tampilan blogger threaded comment dengan tampilan komentar Facebook silahkan iktu tutorialnya di bawah ini.
              ================================================

          ===================================================
Tahap 1 Mengaktifkan Blogger Threaded Comment
Jika Anda belum mengaktifkan komentar terbaru blogger dengan fitur reply / balas otomatis, silahkan ikuti tutorialnya di Cara Membuat Threaded Comment di Blogger.

Atau jika Anda sudah mengaktifkannya silahkan ikuti tahap selanjutnya utnuk menambahkan CSS kedalam template blogspot Anda.
Penambahan CSS Kedalam Template Blogspot
  • Masuk blogger.com dengan akun Anda 
  • Pilih Template Edit HTML Ceklis Expand Template Widget 
  • Letakan CSS di bawah ini sebelum ]]><b:skin>
    ===============================================
.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 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}
 
 ==================================================================================

Mudah bukan cara merubah tampilan komentar blogger agar menyerupai komentar Facebook. Semoga artikel yang berjudul Cara Merubah Tampilan Komentar Blogger Seperti Facebook ini bermanfaat dan berguna.
 

Komentar

  1. Saya harap Anda tetap untuk menuliskan link sumber
    Terima kasih

    BalasHapus
  2. DAPATKAN HARGA PROMO MEYAMBUT TAHUN BARU HAKIR BULAN SEMUAX MURAH-MURAH DI SANI SHOP
    Produk dijamin asli orginal Barang yang Kami Tawarkan Semuanya Barang ASLI ORGINAL Ada Garansi Resmi Distributor dan Garansi TAM 2 bebas resiko bebas penipuan.
    Semua Produk Kami Baru dan Msh Tersegel dLm BOX_nya.
    BERMINAT HUB-0816-597-476 ATAU KLIK WEBSET RESMI KAMI http://sani-shop.blogspot.com/
    Ready Stock! Samsung Galaxy S4 Mini Rp.2,500.000
    Ready Stock! Apple iPhone 5 Rp.2,700.000
    Ready Stock! BlackBerry 9380 Orlando - Black.Rp.900.000,-
    Ready Stock! BlackBerry Curve 8520 Gemini.Rp.500.000,-
    Ready Stock! BlackBerry Bold 9780 Onyx 2.Rp.800.000,-
    Ready Stock! Blackberry Curve 9320.Rp.700.000,-
    Ready Stock! Samsung Galaxy Note 10.1.Rp.2,500.000.
    Ready Stock! Samsung Galaxy Tab 2 (7.0).Rp. 1.000.000
    Ready Stock! Samsung Galaxy S III Mini.Rp.1.800.000.
    Ready Stock! Samsung Galaxy Nexus I9250 - Titanium Si.Rp.1.500.000,-
    Ready Stock! Samsung Galaxy Note N7100.Rp.2.500.000.
    Ready Stock! Samsung Galaxy Note N7000 - Pink.Rp.1.700.000.

    BalasHapus
  3. Mantabs infonya bro...jadi ga klasik banget penampilannya....keren...
    7 Passenger Vehicles | 7 passenger SUV | http://www.7passengervehiclesworld.com

    BalasHapus

Posting Komentar

Postingan populer dari blog ini

22 Tempat Wisata di Asia Tenggara yang Wajib Dikunjungi

2 CARA Membuat Widget Chat Online Gratis Untuk Blog