Sobat masterendi.com berbagi ilmu sama kita-kita tentang Cara Pintar Membuat Reply Comment Sistem Blogger TERBARU, ayok kita simak lebih lanjut !! :)
Langkah - langkah membuat reply comment system blogger terbaru:
1. Masuk ke menu Rancangan
2. Edit HTML
3. Temukan kode berikut :
b:include data='post' name='comments'/>
4. Ganti kode warna merahnya saja dengan kode berikut :
'threaded_comments'/>
jadinya seperti ini :
b:include data='post' name='threaded_comments'/>
Kode b:include data='post' name='comments'/> kemungkinan ada lebih dari satu, cari lagi kode tersebut, lalu lakukan seperti langkah ke empat.
5. Copy kode berikut lalu letakkan diatas tag <body>
<style>/*------------- START Blogger Threaded Comments by www.ravisaive.in -------------*/.comments { clear: both; margin-top: 10px; margin-bottom: 0px; line-height: 1em;}.comments .comments-content {font-size: 12px;margin-bottom: 16px;font-weight: normal;text-align:left;line-height: 1.4em;}.comments .comment .comment-actions a {display: inline-block;margin: 0;padding: 1px 6px;border: 1px solid #C4C4C4;border-top-color: #E4E4E4;border-left-color: #E4E4E4;color: #424242 !important;text-align: center;text-shadow: 0 -1px 0 white;text-decoration: none;-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;background: #EDEDED;background: -webkit-gradient( linear, left top, left bottom, color-stop(.2, white), color-stop(1, #E5E5E5) );background: -moz-linear-gradient( center top, white 20%, #E5E5E5 100% );font: 11px/18px sans-serif;padding:2px 8px; margin-right:10px;}.comments .comment .comment-actions a:hover {text-decoration: none; background:#fff; border:1px solid #5AB1E2;}.comments .comments-content .comment-thread ol { list-style-type: none; padding: 0; text-align: none;}.comments .comments-content .inline-thread { padding: 0.5em 1em;}.comments .comments-content .comment-thread { margin: 8px 0px;}.comments .comments-content .comment-thread:empty { display: none;}.comments .comments-content .comment-replies { margin-top: 1em; margin-left: 40px; font-size:12px; background:#EBF5FE;}.comments .comments-content .comment { margin-bottom:16px; padding-bottom:8px; }.comments .comments-content .comment:first-child { padding-top:16px;}.comments .comments-content .comment:last-child { border-bottom:0; padding-bottom:0;}.comments .comments-content .comment-body { position:relative;}.comments .comments-content .user { font-style:normal; font-weight:bold;}.comments .comments-content .user a {color:#2D5E7B; font-size:14px; font-weight: bold;text-decoration: none;}.comments .comments-content .icon.blog-author { width: 18px; height: 18px; display: inline-block; margin: 0 0 -4px 6px;}.comments .comments-content .datetime {color: #999999;float: right;font-size: 11px;text-decoration: none;}.comments .comments-content,.comments .comments-content .comment-content { margin:0 0 8px;} .comment-header {background-color: #F4F4F4; border: thin solid #E6E6E6; margin-bottom: 5px; padding: 5px;}.comments .comments-content .comment-content { text-align:none;}.comments .comments-content .owner-actions { position:absolute; right:0; top:0;}.comments .comments-replybox { border: none; height: 250px; width: 100%;}.comments .comment-replybox-single { margin-top: 5px; margin-left: 48px;}.comments .comment-replybox-thread { margin-top: 5px;}.comments .comments-content .loadmore a { display: block; padding: 10px 16px; text-align: center;}.comments .thread-toggle { cursor: pointer; display: inline-block;}.comments .continue { cursor: pointer;}.comments .continue a {display: inline-block;margin: 0;padding: 1px 6px;border: 1px solid #C4C4C4;border-top-color: #E4E4E4;border-left-color: #E4E4E4;color: #424242 !important;text-align: center;text-shadow: 0 -1px 0 white;text-decoration: none;-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;background: #EDEDED;background: -webkit-gradient( linear, left top, left bottom, color-stop(.2, white), color-stop(1, #E5E5E5) );background: -moz-linear-gradient( center top, white 20%, #E5E5E5 100% );font: 11px/18px sans-serif;padding:2px 8px; margin-right:10px;}.comments .comments-content .loadmore { cursor: pointer; max-height: 3em; margin-top: 3em;}.comments .comments-content .loadmore.loaded { max-height: 0px; opacity: 0; overflow: hidden;}.comments .thread-chrome.thread-collapsed { display: none;}.comments .thread-toggle { display: inline-block;}.comments .thread-toggle .thread-arrow { display: inline-block; height: 6px; width: 7px; overflow: visible; margin: 0.3em; padding-right: 4px;}.comments .thread-expanded .thread-arrow { background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAc AAAAHCAYAAADEUlfTAAAAG0lEQVR42mNgwAfKy8v/48I4FeA0AacVDFQBAP9wJkE/KhUMAAAAAElFTkSuQmCC") no-repeat scroll 0 0 transparent;}.comments .thread-collapsed .thread-arrow { background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAA AcAAAAHCAYAAADEUlfTAAAAJUlEQVR42mNgAILy8vL/DLgASBKnApgkVgXIkhgKiNKJ005s4gDLbCZBiSxfygAAAAB JRU5ErkJggg==") no-repeat scroll 0 0 transparent;}.comments .avatar-image-container {background-image: url("http://img846.imageshack.us/img846/7357/unled1oww.jpg");background-position: center center;background-repeat: no-repeat;float: left;width: 36px;max-height: 36px;margin: 0;outline: 1px solid #FFFFFF;padding: 3px;vertical-align: middle;overflow: hidden;border: 1px solid #DDDDDD;}.comments .avatar-image-container img { width: 36px;}.comments .comment-block { margin-left: 48px; position: relative;} /* Responsive styles. */@media screen and (max-device-width: 480px) { .comments .comments-content .comment-replies { margin-left: 0; }} /*------------- End of Blogger Threaded Comments by www.ravisaive.in -------------*/</style>
6. Save template sobat
selesai !! selamat mencobaaa :D
source: http://www.masterendi.com/2012/02/cara-membuat-reply-comment-system.html
Selasa, 26 Juni 2012
Cara Pintar Membuat Reply Comment Sistem Blogger TERBARU
Langganan:
Posting Komentar (Atom)
0 komentar:
Posting Komentar