Home > Blogger Hack > Cara Modifikasi/costumize Blogger Thread Comment
Cara Modifikasi/costumize Blogger Thread Comment
Posted on Minggu, 14 Oktober 2012 by do it your self
D-Copy Blog | Hai sahabat blogger semua, di sore yang mendung ini ( 14 Oktober 2012, 15:48) kita akan membahas bagaimana cara memodifikasi/costumize blogger thread comment. Mungkin jika Anda sering bermain main ke blog terkenal www.spiceupyourblog.com mungkin Anda akan melihat komentar blog tersebut akan sama seperti yang saya utarakan ini. Saya hanya mengcopy page source blog tersebut dan seperti dibawah ini contoh gambar commentnya :
4. Ganti kode (langkah 3) dengan kode dibawah ini :
Tahap Kedua, memodifikasi Blogger Thread Comments :
Blogger Thread Comment Hack 1
Blogger Thread Comment Hack 2
Blogger Thread Comment Hack 1 |
-------------------------------------------------------------------------------
Blogger Thread Comment Hack 2 |
Saya memang suka menghack blog saya jadi apa salahnya saya berbagi ilmu kepada Anda. Sebelum melakukan tutorial hack ini, Anda harus menggunakan blogger thread comment seperti yang saya juga gunakan. Anda tidak mengerti apa itu blogger thread comment? Blogger thread comment adalah sebuah gaya komentar berbalas seperti gambar diatas dan yang sa juga gunakan.
Tahap Pertama, jika Blog Anda tidak memiliki fitur Blogger Thread Comments :
- Terlebih dahulu backup template Anda
- Masuk ke Menu Edit HTML, jangan lupa centang Expand Template Widget
- Cari kode dibawah ini :
<b:include data='post' name='comments'/>Keterangan :
- Kode diatas ada 3-4, ganti seluruhnya
4. Ganti kode (langkah 3) dengan kode dibawah ini :
<b:if cond='data:post.showThreadedComments'>5. Save Template Anda.
<b:include data='post' name='threaded_comments'/>
<b:else/>
<b:include data='post' name='comments'/>
</b:if>
Tahap Kedua, memodifikasi Blogger Thread Comments :
- Masih pada langkah kedua diatas, lalu cari kode yang mirip seperti dibawah ini di template Anda :
#comments{overflow:hidden}5. Jika sudah ketemu kode yang mirip pada kode ditas di HTML blog Anda, ganti seluruh kode tersebut dengan kode dibawah ini :
#comments h4{display:inline;padding:10px;line-height:40px}
#comments h4,.comments .comment-header,.comments .comment-thread.inline-thread .comment{position:relative}
#comments h4,.comments .continue a{background:#b6cfea}
#comments h4,.comments .user a,.comments .continue a{font-size:12px}
#comments h4,.comments .continue a{font-weight:normal;color:#fff}
#comments h4:after{content:"";position:absolute;bottom:-10px;left:10px;border-top:10px solid #b6cfea;border-right:20px solid transparent;width:0;height:0;line-height:0}
#comments .avatar-image-container img{border:0}
.comment-thread{color:#111}
.comment-thread a{color:#777}
.comment-thread ol{margin:0 0 20px}
.comment-thread .comment-content a,.comments .user a,.comments .comment-thread.inline-thread .user a{color:#b6cfea}
.comments .avatar-image-container,.comments .avatar-image-container img{width:48px;max-width:48px;height:48px;max-height:48px}
.comments .comment-block,.comments .comments-content .comment-replies,.comments .comment-replybox-single{margin-left:60px}
.comments .comment-block,.comments .comment-thread.inline-thread .comment{border:1px solid #ddd;background:#f9f9f9;padding:10px}
.comments .comments-content .comment{margin:15px 0 0;padding:0;width:98%;line-height:1em}
.comments .comments-content .icon.blog-author{position:absolute;top:-12px;right:-12px;margin:0;background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQV0SAxyH3JdE7aq8QztTK4CIQCrpKdpEhxU9t_vT89AaIt1gsQB2DxCrQSyWdZEEevSNBEjCYUtgYPYdSEQ9KJqb25dU0HWT_fzSH4MAEYgIT5Gdb0SFzU9kB6_UzOBhEvYJCYMrEADg/s320/picresized_1338990142_comment-author-blue.gif338990142_comment-author-blue.gif);width:36px;height:36px}
.comments .comments-content .inline-thread{padding:0 0 0 20px}
.comments .comments-content .comment-replies{margin-top:0}
.comments .comment-content{padding:5px 0;line-height:1.4em}
.comments .comment-thread.inline-thread{border-left:1px solid #ddd;background:transparent}
.comments .comment-thread.inline-thread .comment{width:auto}
.comments .comment-thread.inline-thread .comment:after{content:"";position:absolute;top:10px;left:-20px;border-top:1px solid #ddd;width:10px;height:0px}
.comments .comment-thread.inline-thread .comment .comment-block{border:0;background:transparent;padding:0}
.comments .comment-thread.inline-thread .comment-block{margin-left:48px}
.comments .comment-thread.inline-thread .user a{font-size:13px}
.comments .comment-thread.inline-thread .avatar-image-container,.comments .comment-thread.inline-thread .avatar-image-container img{width:36px;max-width:36px;height:36px;max-height:36px}
.comments .continue{border-top:0;width:98%}
.comments .continue a{padding:10px 0;text-align:center}
.comment .continue{display:none}
#comment-editor{width:98%!important}
.comment-form{width:100%;max-width:100%}
Blogger Thread Comment Hack 1
/*Blogger Thread Comment D-Copy*/
#comments-block.avatar-comment-indent {margin: 2em 0 1.5em !important;position: relative;}
dl#comments-block {line-height: 1.5em;margin: 2em 0 1.5em !important;}
#comments-block .comment-author {background: none repeat scroll 0 0 #A9F5D0;color: #FFFFFF;font-size: 15px;font-weight: bold;margin-left: 60px;}
#comments-block .comment-author a, dl#comments-block dt.author-comment a {color: #FFFFFF;text-decoration: none;}
#comments-block .avatar-image-container {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiw69Cz_XQZ1C4XBTB1NEQVJES_zymqnaKvMuWMBKGKmLtaTAxQgQZ6rRGGtgXaj8hgaE_Ty3SV3GVTRC71XMmU5a3EOp8ms1dqBvbUmBFAaoScksa4Ko7URLxAMJ6CGeBet6HT54kLgJJB/s1600/Wide_Brush_64x64.png") no-repeat scroll center center #FFFFFF;border: 1px solid #B6B6B6;height: 70px !important;left: 0;margin-top: -10px;position: absolute;width: 70px !important;}
#comments-block .avatar-image-container img {border: medium none !important;float: right;height: 70px !important;width: 70px !important;}
#comments-block .avatar-image-container.avatar-stock img {border-width: 0;padding: 0;}
.commentauthorname {background: none repeat scroll 0 0 #DF7401;border: 1px solid #FFFFFF;color: #FFFFFF;padding: 0 20px;position: relative;z-index: 99;}
#comments-block .comment-body {background: none repeat scroll 0 0 #FEFFF9;border-bottom: 2px solid #E6E6E6;font-size: 14px;margin: 0 0 30px;padding: 5px 5px 20px 90px;}
#comments-block .comment-body p {margin: 0 0 0.75em;}
#comments-block .comment-footer {background: none repeat scroll 0 0 transparent;border: medium none;font-size: 12px;font-style: italic;font-weight: normal;margin: 0 5px;text-decoration: none;}
#comments-block .comment-footer a {color: #444444;text-decoration: none;}
#comments-block .naacomment {background: none repeat scroll 0 0 #E0ECF8;color: #FFFFFF;font-size: 15px;font-weight: bold;margin-left: 60px;}
#comments-block .naacomment a {color: #FFFFFF;text-decoration: none;}
#comments-block .naacomment {background: none repeat scroll 0 0 #E0ECF8;color: #FFFFFF;font-size: 15px;font-weight: bold;margin-left: 60px;}
#comments-block .naaperu {background: none repeat scroll 0 0 #8181F7;border: 1px solid #FFFFFF;color: #FFFFFF;padding: 0 20px;position: relative;z-index: 99;}
#comments-block .naacommentbody {background: url("") no-repeat scroll right bottom #F9F9FC;border-bottom: 2px solid #E6E6E6;font-size: 14px;margin: 0 0 30px;padding: 5px 5px 20px 90px;}
#comments-block .naacommentbody p {margin: 0 0 0.75em;}
#comments-block .naacommentfooter {background: none repeat scroll 0 0 transparent;border: medium none;font-size: 12px;font-style: italic;font-weight: normal;margin: 0 5px;text-decoration: none;}
#comments-block .naacommentfooter a {color: #444444;text-decoration: none;} /* start */
.comment .comment-header{background: none repeat scroll 0 0 #A9F5D0;color: #333;font-size: 15px;font-weight: bold;margin-left: 60px;}
.comment .comment-header a {color: #FFFFFF !important;text-decoration: none;}
.comment .avatar-image-container {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiw69Cz_XQZ1C4XBTB1NEQVJES_zymqnaKvMuWMBKGKmLtaTAxQgQZ6rRGGtgXaj8hgaE_Ty3SV3GVTRC71XMmU5a3EOp8ms1dqBvbUmBFAaoScksa4Ko7URLxAMJ6CGeBet6HT54kLgJJB/s1600/Wide_Brush_64x64.png") no-repeat scroll center center #FFFFFF;border: 1px solid #B6B6B6;max-height: 70px !important;margin-top: -5px;width: 70px !important;position:relative;z-index:50;}
.comment .comment-block {margin-left: 75px;}
.comment .avatar-image-container img {border: medium none !important;height: 70px !important;width: 70px !important;max-height: 70px !important;max-width: 70px !important;}
.comment-header cite {background: none repeat scroll 0 0 #DF7401;border: 1px solid #FFFFFF;color: #FFFFFF;padding: 0 20px;position: relative;z-index: 99;margin-left:-20px;}
.comment .comment-content {background: none repeat scroll 0 0 #FEFFF9;border-bottom: 2px solid #E6E6E6;font-size: 14px;margin: 0 0 30px;padding: 5px 5px 10px 10px;}
.comment .comment-actions a{background: none repeat scroll 0 0 #DDDDDD;color: #333333;display: inline-block;line-height: 1;margin: 0 3px;padding: 3px 6px !important;text-decoration: none;}
.comment .comment-actions a:hover{background:#CCC;text-decoration: none !important;}
cite.blog-author {background: none repeat scroll 0 0 #8181F7 !important;;}
.icon.blog-author {display:none;background: url("") no-repeat scroll 0 0;margin-left: 90px;width:60px !important;height:60px !important;position:absolute;right:5px;bottom:5px;top:10px;}/* end */
a.backtotop{display: block;height: 54px;position: absolute;right: 20px;top: -6px;width: 70px;z-index:56;}
/*End Blogger Thread Comment D-Copy*/
Blogger Thread Comment Hack 2
/*Blogger Thread Comment D-Copy*/6. Save Template Anda dan lihat pembaruan komentar Anda mirip dengan Spice U'r Blog.
#comments h4{ margin:1em 0; font-weight:bold; font-size:15px; text-shadow:1px 1px 1px #ddd; line-height:1.4em; text-transform:uppercase; letter-spacing:.2em; color:$sidebarcolor}
#comments-block.avatar-comment-indent {
margin: 2em 0 1.5em !important;
position: relative;
}
dl#comments-block {
line-height: 1.5em;
margin: 2em 0 1.5em !important;
}
#comments-block .comment-author {
background: none repeat scroll 0 0 #A9F5D0;
color: #FFFFFF;
font-size: 15px;
font-weight: bold;
margin-left: 60px;
}
#comments-block .comment-author a, dl#comments-block dt.author-comment a {
color: #FFFFFF;
text-decoration: none;
}
#comments-block .avatar-image-container {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhSlNkUHN3wLoQBhzo2g8yLSBn9d2jhiIiCkL3mGPfJvmRnaODZ3T46srO-xbbiOt4-kMsr7JTDEB0sCE_f4mEqXfCRDdfTAfNNZqNS5TCiMqdF6UM_OhbBLMb-KreN8B89GChD6YyPWS5K/s1600/bbt-comment-avatar.png") no-repeat scroll center center #FFFFFF;
border: 1px solid #B6B6B6;
height: 70px;
left: 0;
margin-top: -10px;
position: absolute;
width: 70px;
}
#comments-block .avatar-image-container img {
border: medium none !important;
float: right;
height: 70px;
width: 70px;
}
#comments-block .avatar-image-container.avatar-stock img {
border-width: 0;
padding: 0;
}
.commentauthorname {
background: none repeat scroll 0 0 #DF7401;
border: 1px solid #FFFFFF;
color: #FFFFFF;
padding: 0 20px;
position: relative;
z-index: 99;
}
#comments-block .comment-body {
background: none repeat scroll 0 0 #FEFFF9;
border-bottom: 2px solid #E6E6E6;
font-size: 14px;
margin: 0 0 30px;
padding: 5px 5px 20px 90px;
}
#comments-block .comment-body p {
margin: 0 0 0.75em;
}
#comments-block .comment-footer {
background: none repeat scroll 0 0 transparent;
border: medium none;
font-size: 12px;
font-style: italic;
font-weight: normal;
margin: 0 5px;
text-decoration: none;
}
#comments-block .comment-footer a {
color: #444444;
text-decoration: none;
}
#comments-block .naacomment {
background: none repeat scroll 0 0 #E0ECF8;
color: #FFFFFF;
font-size: 15px;
font-weight: bold;
margin-left: 60px;
}
#comments-block .naacomment a {
color: #FFFFFF;
text-decoration: none;
}
.naaperu {
background: none repeat scroll 0 0 #8181F7;
border: 1px solid #FFFFFF;
color: #FFFFFF;
padding: 0 20px;
position: relative;
z-index: 99;
}
#comments-block .naacommentbody {
background: url("http://i.imgur.com/UqufZ.gif") no-repeat scroll right bottom #F9F9FC;
border-bottom: 2px solid #E6E6E6;
font-size: 14px;
margin: 0 0 30px;
padding: 5px 5px 20px 90px;
}
#comments-block .naacommentbody p {
margin: 0 0 0.75em;
}
#comments-block .naacommentfooter {
background: none repeat scroll 0 0 transparent;
border: medium none;
font-size: 12px;
font-style: italic;
font-weight: normal;
margin: 0 5px;
text-decoration: none;
}
#comments-block .naacommentfooter a {
color: #444444;
text-decoration: none;
}
/*End Blogger Thread Comment D-Copy*/
Artikel Terkait
Category Article Blogger Hack
Arsip Blog
-
▼
2012
(4523)
-
▼
Oktober
(2077)
- 8 Hal yang Tak Boleh Dikatakan Pada Calon Pengantin
- 7 Tipe Pria di Internet
- Di China Ada Nenek-Nenek Berumur 1 Tahun!
- Bangkit Dari Putus Cinta? Ini Triknya
- Cara Membuat Efek Petir di Blog
- Jamur Truffle, Jamur Termahal di Dunia
- Prediksi Togel Hongkong Hari Ini Kamis 01 November...
- Prediksi Togel Singapura Kamis 01 November 2012
- Prediksi Togel hari Ini (Kamis 01 November 2012) T...
- Berbagai Bentuk Buah-Buahan yang Unik dan Lucu
- Jangan Menyimpan Kaleng Cola Di Freezer Atau Begin...
- Pasangan Kolombia Lahirkan Bayi Jelmaan Setan?
- Indahnya Pelangi Moon Bow Dimalam Hari
- VIA ARTiGO A1250, PC Terkecil di Dunia dengan Pros...
- 10 Musium paling menakutkan di dunia
- 10 Laga terbaik sepanjang sejarah sepak bola dunia
- Kepribadian Cewe berdasarkan cara duduknya
- 10 tembok paling bersejarah di dunia
- 10 Bandara terbaik di dunia
- Hutan Raje Mandare yang penuh dengan keanehan
- Fakta Menarik dari Alat Kelamin Pria
- Musim Hujan Bikin Orang Makin Galau, Kamu Termasuk?
- Tenis Meja : Apa Istimewanya ?
- 10 Hand Phone/HP terunik di dunia
- Kota termacet di dunia
- Kulam, Ilmu Voodoo dari Filipina
- Foto-Foto Ular Memangsa Manusia
- Unik: Jalan Tol Antar Gedung Di Jepang
- Kejadian aneh yang tidak masuk logika
- Fakta unik tentang negara Korea Utara
- Fakta unik tentang Ikan di Dunia
- 7 Jenis Jerawat Paling Umum Ditemui
- Mitos, Tsunami Jepang Akibat Ikan Lele Raksasa
- Tips jika HP tercebur ke air
- Dilarang Menggunakan Celana Melorot di Wilayah ini!
- Menambahkan gadget di header blog
- Cara memanipulasi jumlah komentar blog
- Sosok ilmuwan Muslim yang terlupakan
- Inilah 10 Sate Terunik di Indonesia
- Cara mengatasi/mengobati kulit kaki pecah dan kapalan
- Dampak Buruk Sering Curhat Masalah Cinta dengan Sa...
- Inilah 10 Tempat Ziarah Terseram Di Dunia
- Planet Theia, Benda Besar Yang Menabrak Bumi
- Makhluk-makhluk ini Mata Rantai Evolusi yang Hilang?
- “Moses Bridge” Jembatan yang Membelah Sungai di Be...
- Patung Wisnu Kencana Tertinggi di Dunia
- 4 Miss World Paling Kontraversial di Dunia
- Cara ngecek suhu/temperatur panas komputer
- Cara memperbaiki dokumen MS Office yang rusak
- 10 Tipe Cewek Berdasarkan Bentuk Payudara
- Wujud Asli Dari Firefox
- 7 Minuman Keras Asli Indonesia
- Mengapa Banyak Artis Korea Bunuh Diri?
- 12 Peristiwa Berdarah Sepakbola Terburuk Dalam 3 D...
- Sosok Dan Pesona Ibukota Jakarta Pada Tahun 1970-an
- 5 Kisah Penghargaan/hadiah Paling Aneh Di Dunia
- Hal-hal pemicu keluarnya kentut
- Inilah hewan yang bisa memprediksi cuaca
- 10 Masjid tertua di dunia
- Foto-foto Kapal Titanic dari proses pembuatan samp...
- 10 Hasil Penelitian Menarik tentang Orgasme
- Benarkah Payu Dara besar tidak nyaman saat bercinta
- Roler Coaster yang bikin mendebarkan jantung
- Cara Asik Jaga Kesehatan Kulit
- Alat-alat kreatif untuk di dapur
- Inilah 5 Tanda Tangan Termahal Di Dunia
- Tampang Bintang Rock pada Masa Muda dan Tua
- VIDEO Badai Sandy Tertangkap Kamera dari Luar Angkasa
- Makan Ini Ternyata Bisa Untuk Mengembalikan Mood B...
- Tips Jika Terjebak Jatuh Cinta Dalam 'Friend Zone'
- Bersyukurlah Atas Hp Yang Anda Miliki!!
- Ciri-Ciri Pria yang Mempunyai Masa Depan Cerah
- Rajanya Twitter, Bukan Orang Terkenal, 1,8 Juta Fo...
- Menyibak Misteri Pohon Zaitun Tempat Yesus Berdoa
- Suku Maya Protes Ramalan Kiamat Demi Keuntungan Bi...
- Rudal Iran Itu Bernama “Nabi Agung 7”
- Kostum Jadul Para Superhero, Hulk-nya Dijamin Ngak...
- 6 Tips Mengatasi Bau Kaki
- 4 Kebudayaan Jepang yang Unik dan Gila
- 6 Mitos Pria yang Mulai Kadaluwarsa
- Gaet Pasangan, Monyet Berlumur Air Seni
- 10 Cerutu Termahal Di Dunia
- 8 Fakta Menarik tentang Kota Seoul
- Perbedaan Lama Durasi Puasa Di Berbagai Belahan Dunia
- Iklan 'Diskon TKW' Menghina Harga Diri Bangsa Indo...
- Mengungkap asal usul Patih Gajah Mada yang misterius
- Kuil Putih, Mahakarya Sang Seniman Eksentrik
- Sayuran raksasa pemecah rekor
- [renungan] Belajar Tentang Kehidupan dari Johnny Depp
- Demi Perluas Masjid Nabawi, Makam Nabi Muhammad Ak...
- Foto badai Sandy diatas patung Liberty | Asli atau...
- Kumpulan Kata Kata Mutiara Persahabatan Sejati
- Mengungkap Legenda Taman Gantung Babylonia
- Tokyo Skytree, Menara Tertinggi di Dunia
- Inilah Arti Kata Ciyus, Miapah, Cemungudh, dll...
- Mitos asal muasal larangan menikah orang jawa dan ...
- Candi-candi terindah di India dan sekitarnya
- "dia Cinta Aku Nggak Sih?" Liat Saja Pupil Matanya
- 7 Jenis Pahala Yang Dapat Dinikmati Selepas Mati
- 7 Gunung Berwajah Manusia yang Terkenal di Dunia
-
▼
Oktober
(2077)