Modifikasi Threaded Comment Pada Blogger. Part 1

Threaded Comment rohis facebook

Bismillah...

Modifikasi Threaded Comment Pada Blogger. Part 1 -- Dua bulan lebih Blog Rohis Facebook tidak memposting tentang Tutorial Blogger, sekarang tiba saatnya untuk 'Balas Dendam', sekali memposting langsung 4 (empat) artikel hehehe....

Setelah Threaded Comment bisa dipasang pada blogger mulailah para master blogger berkreasi mendesain tampilannya dengan berbagai style dan tambahan beberapa fungsi seperti Threaded Comment yang bisa menampilkan emoticon, gambar dan video, tutorialnya bisa dilihat disini (Again, Threaded Comment dari Blogger Items).

Cara membuatnya.

1. Login ke Akun blogger

2. Klik Template

3. KlikEdit HTML

4. Klik Proceed

5. Cari taq ]]></b:skin> (gunakan kontrol F untuk memudahkan pencarian)

6. Setelah dapat lalu masukkan kode dibawah ini diatas taq ]]></b:skin>

/*-- http://apabae.info/ ---*/ @font-face { font-family: 'Philosopher'; font-style: normal; font-weight: 400; src: local('Philosopher'), url(http://themes.googleusercontent.com/static/fonts/philosopher/v4/OttjxgcoEsufOGSINYBGLYbN6UDyHWBl620a-IRfuBk.woff) format('woff'); } .comment .avatar-image-container { 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 !important; } .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: white !important; text-decoration: none; } .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 #DDD; color: #333; display: inline-block; line-height: 1; margin: 0 3px; padding: 3px 6px !important; text-decoration: none; } .comment .comment-actions a { background: none repeat scroll 0 0 #DDD; color: #333; display: inline-block; line-height: 1; margin: 0 3px; padding: 3px 6px !important; text-decoration: none; } .comment-header cite { background: none repeat scroll 0 0 #DF7401; border: 1px solid white; color: white; padding: 2px 20px; position: relative; z-index: 99; margin-left: -20px; } cite.blog-author { background: none repeat scroll 0 0 #8181F7 !important; } .icon.blog-author { display: none !important; background: url("") no-repeat scroll 0 0; margin-left: 90px; width: 60px !important; height: 60px !important; position: absolute; right: 5px; bottom: 5px; top: 10px; } .comment .comment-header { color: #333; font-size: 15px; font-weight: bold; } .comment .avatar-image-container img { border: medium none !important; height: 70px !important; width: 70px !important; max-height: 70px !important; max-width: 70px !important; } .comment .comment-actions a { background: none repeat scroll 0 0 #DDD !important; color: #333 !important; display: inline-block !important; line-height: 1 !important; margin: 0 3px !important; padding: 3px 6px !important; text-decoration: none !important; font-size:16px; } .comment .comment-actions a:hover { background: #CCC !important; text-decoration: none !important; } .comments { font-family: 'Philosopher', arial, serif !important; font-size: 1em; color: black; } .comments .continue a { display: block !important; font-weight: bold !important; padding: .5em !important; color:#E34600; font-size:16px; } .comments .continue a:hover {color:#4D3123;text-decoration:none;} .item-control { display: none !important; } .comments .continue { border-top: 2px solid transparent !important; } /*-- http://apabae.info/ ---*/

7. Kik Pratinjau, kalau tidak terjadi kesalahan lalu klik save template

Lihat Demonya cocok untuk template yang berlatar Putih

Sumber : http://www.spiceupyourblog.com