cara Membuat Kotak Thread Komentar plus emoticon kaskus

bagi temen temen yang ingin membuat kotak komentar yang seperti di web saya . silahkan mengikuti cara berikut ini :

1.template > edit html > centang expland template widget :
cari kode berikut dengan menggunakan f3 :  ]]></b:skin> . setelah ketemu .letakan kode/script di bawah ini diatas kode ]]></b:skin>


/* Comments
----------------------------------------------- */
#comments h4 {
font-size: 18px;
font-weight: normal;
margin: 20px 0;
}
.cm_wrap {
clear: both;
margin-bottom: 10px;
float: right;
width: 100%;
}
.cm_head {
margin: 0;
width:60px;
float: left;
}
.cm_avatar {
margin: 0;
vertical-align: middle;
border: 1px solid #DDD;
padding: 3px;
background: url(http://4.bp.blogspot.com/-YemqbaT_OBk/To1GlQs7yVI/AAAAAAAAAJA/jvEmEASW6_Q/s1600/takdikenal.jpg) center no-repeat;
width: 35px;
height: 35px;
}
.cm_avatar_a {
margin: 0;
vertical-align: middle;
border: 1px solid #DDD;
padding: 3px;
background:#c6e5f7;
background-position:center;
background-repeat:no-repeat;
width: 35px;
height: 35px;
}
.cm_reply {
padding-top: 5px;
}
.cm_reply 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;
}
.cm_reply a:hover {
text-decoration: none !important;;
background: #ccc;;
background: -webkit-gradient(linear,left top,left bottom,color-stop(.2, #eeeeee),color-stop(1, #cccccc));;
background: -moz-linear-gradient(center top,#eeeeee 20%,#cccccc 100%);;
}
.cm_entry {
padding: 16px;
background: #fcfcfc;
border: 1px solid #E4E4E4;
overflow: hidden;
}
.cm_arrow {
display: block;
width: 9px;
height: 18px;
background: url(http://3.bp.blogspot.com/-NONrBLhghFk/To0nNB1LmkI/AAAAAAAAAI4/CAuzDfYiCiU/s1600/comment-arrow.gif) no-repeat;
position: absolute;
margin-left: -25px;
}
.cm_info {
margin-bottom: 5px;
border: thin solid #E6E6E6;
background-color: #F4F4F4;
padding: 5px;
}
.cm_info_a {
margin-bottom: 5px;
border: thin solid #E6E6E6;
background-color: #dff0fa;
padding: 5px;
}
.cm_name {
font-size: 14px;
color: #666666 !important;
text-decoration:none;
float: left;
}
.cm_name_a {
font-family:"Comic Sans MS", cursive;
font-size: 14px;
color: #666666 !important;
text-decoration:none;
font-weight: bold;
float: left;
}
.cm_date {
font-size: 10px;
color: #999;
text-decoration:none;
float: right;
}
.cm_date_a {
font-family:"Comic Sans MS", cursive;
font-size: 10px;
color: #2D5E7B;
text-decoration:none;
float: right;
padding-top:5px;
}
.cm_entry p {
padding: 5px;
clear: both;
border: thin solid #E6E6E6;
background-color: #ffffff;
font-size: 13px;
color: #333;
word-wrap:break-word;
}
.cm_entry_a p {
padding: 5px;
clear: both;
border: thin solid #E6E6E6;
background-color:  #ffffff;
font-size: 13px;
color: #333;
word-wrap:break-word;
}
.cm_pagenavi {
font-size: 10px;
text-transform: uppercase;
color: #666;
text-shadow: 1px 1px white;
font-weight: bold;
}
.cm_pagenavi a {
color: #666;
text-decoration: none;
padding:10px;
}
.cm_pagenavi a:hover {
text-decoration: underline
}
.cm_pagenavi span {
color: #888;
background: white;
padding: 4px;
border: 1px solid #E0E0E0;
}
/* Comment Admin  */
.comment-body-author {
font-family:"Comic Sans MS", cursive;
font-weight: 300;
}


kemudian cari kode </body> . taro kode/script di bawah ini diatas nya :

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script src='http://donor-ilmu.googlecode.com/files/comment.js' type='text/javascript'/>
<script src='http://taufikismail.googlecode.com/files/khs.js' type='text/javascript'/>
</b:if>


cari kode <h4 id='comment-post-message'><data:postCommentMsg/></h4> . taro script ini di bawah nya



<img src='http://1.bp.blogspot.com/-ENIB9bgeb8A/UAq8ttCqf_I/AAAAAAAAEVg/SCQzdU8ta-s/s1600/PostAComment+(2).png'/>
<div style='width:623px;text-align: center;border: 1px solid #ccc;padding: 2px 2px;margin-top: 15px;font-style:bold;color:#000;font-weight:normal;font-size:10px;'>
    <b><img border='0' height='50' src='http://static.kaskus.co.id/images/smilies/ngakak.gif' width='50'/>:k1
  <img border='0' height='50' src='http://static.kaskus.co.id/images/smilies/fd_2.gif' width='50'/>:k2
<img border='0' height='50' src='http://static.kaskus.co.id/images/smilies/sundul.gif' width='50'/>:k3
  <img border='0' height='50' src='http://static.kaskus.co.id/images/smilies/cool2.gif' width='50'/>:k4
  <img border='0' height='50' src='http://static.kaskus.co.id/images/smilies/toastcendol.gif' width='50'/>:k5
  <img border='0' height='50' src='http://static.kaskus.co.id/images/smilies/hammer.gif' width='50'/>:k6
  <img border='0' height='50' src='http://static.kaskus.co.id/images/smilies/ngacir2.gif' width='50'/>:k7
  <img border='0' height='50' src='http://static.kaskus.co.id/images/smilies/capede.gif' width='50'/>:k8
  <img border='0' height='50' src='http://static.kaskus.co.id/images/smilies/bingung.gif' width='50'/>:k9
<img border='0' height='50' src='http://static.kaskus.co.id/images/smilies/jempol2.gif' width='50'/>:a1
  <img border='0' height='50' src='http://static.kaskus.co.id/images/smilies/shakehand2.gif' width='50'/>:a2
  <img border='0' height='50' src='http://lh3.ggpht.com/_RVpTV2JOOxA/S1FVFWdwpBI/AAAAAAAAByM/bVVvVCP5Ap0/kaskuser_t4belajarblogger_09.gif' width='50'/>:a3
<img border='0' height='50' src='http://lh5.ggpht.com/_RVpTV2JOOxA/S1FVohvRi6I/AAAAAAAABys/O4WgQHkgVPc/kaskuser_t4belajarblogger_17.gif' width='50'/>:a4
  <img border='0' height='50' src='http://static.kaskus.co.id/images/smilies/I-Luv-Indonesia.gif' width='50'/>:a5
  <img border='0' height='50' src='http://static.kaskus.co.id/images/smilies/takut.gif' width='50'/>:a6
  <img border='0' height='50' src='http://static.kaskus.co.id/images/smilies/cystg.gif' width='50'/>:a7
  <img border='0' height='50' src='http://static.kaskus.co.id/images/smilies/s_big_batamerah.gif' width='50'/>:a8
  <img border='0' height='50' src='http://lh4.ggpht.com/_RVpTV2JOOxA/S1FVoQzxquI/AAAAAAAAByo/SFSJaRx2lbM/kaskuser_t4belajarblogger_16.gif' width='50'/>:a9
  <img border='0' height='50' src='http://static.kaskus.co.id/images/smilies/malu.gif' width='50'/>:b1
  <img border='0' height='50' src='http://static.kaskus.co.id/images/smilies/berduka.gif' width='50'/>:b2
  <img border='0' height='50' src='http://static.kaskus.co.id/images/smilies/request.gif' width='50'/>:b3
<img border='0' height='50' src='http://static.kaskus.co.id/images/smilies/matabelo1.gif' width='50'/>:b4
  <img border='0' height='50' src='http://static.kaskus.co.id/images/smilies/marah.gif' width='50'/>:b5
  </b>
  </div>

selanjut nya hapus kode yang di antara script berikut :
<b:includable id='comments' var='post'>

Hapus kode yang ada di sini
</b:includable>


lalu ganti dengan script berikut :


<div class='comments' id='comments'>
  <a name='comments'/>
  <b:if cond='data:post.allowComments'>
  <h4>
  <b:if cond='data:post.numComments &gt; 0'>
<a href='#comment-form' style='float:right; margin-right:5px;'>+ <data:commentLabelPlural/> +</a>
  <b:if cond='data:post.numComments == 1'>
  <span id='cm_total'>1</span> <data:commentLabelPlural/> 
  <b:else/>
  <span id='cm_total'><data:post.numComments/></span> <data:commentLabelPlural/>
  </b:if>
  </b:if>
  </h4>
  
  <div id='cm_reply_css'/>
  
  <div class='cm_pagenavi' id='cm_page'/>
  
  <div id='cm_block'>
  <b:loop values='data:post.comments' var='comment'>
  <b:if cond='data:comment.isDeleted'>
  <b:else/>
  
  <div expr:id='data:comment.anchorName'>
  <div class='cm_wrap'>
  <a expr:name='data:comment.anchorName'/> 
  <div class='cm_head'>
  <div class='cm_avatar'>
  <b:if cond='data:blog.enabledCommentProfileImages'>
  <data:comment.authorAvatarImage/>
  </b:if> 
  </div>
  <div class='cm_reply'>
  <a expr:href='&quot;https://www.blogger.com/comment.g?blogID=0000000000000000000&amp;postID=&quot; + data:post.id + &quot;&amp;isPopup=true&amp;postBody=%40%3C%61%20%68%72%65%66%3D%22%23&quot; + data:comment.anchorName + &quot;%22%3E&quot; + data:comment.author + &quot;%3C%2F%61%3E#form&quot;' onclick='javascript:window.open(this.href, &quot;bloggerPopup&quot;, &quot;toolbar=0,location=0,statusbar=1,menubar=0,scrollbars=yes,width=600,height=500&quot;); return false;'>Reply</a>
  </div>
  </div>
  <b:if cond='data:comment.author == data:post.author'>
  <dd class='cm_entry'>
 <span class='cm_arrow'/>
  <div class='cm_info_a'>
  <div class='cm_name_a'>
  <b:if cond='data:comment.authorUrl'>
  <img height='20px' src='http://3.bp.blogspot.com/-40eKncoFCNM/To1Gy7ZIbiI/AAAAAAAAAJI/KG0TKarHI7M/s1600/adminstar.png' title='Admin' width='20px'/>
  <a expr:href='data:comment.authorUrl' rel='nofollow' target='_blank'>
  <data:comment.author/>
  </a>
  <b:else/>
  <b><data:comment.author/></b>
  </b:if>
  </div>
  <div class='cm_date_a'>
  <data:comment.timestamp/>
  <b:include data='comment' name='commentDeleteIcon'/>
  </div>
  <div class='clear'/> 
  </div>
  
  <div class='comment-body-author'>
  <p><data:comment.body/></p>
  </div>
  </dd>
  <b:else/>
  <dd class='cm_entry'>
  <span class='cm_arrow'/>
  <div class='cm_info'>
  <div class='cm_name'>
  <b:if cond='data:comment.authorUrl'>
  <a expr:href='data:comment.authorUrl' rel='nofollow' target='_blank'>
  <data:comment.author/>
  </a>
  <b:else/>
  <b><data:comment.author/></b>
  </b:if>
  </div>
  <div class='cm_date'>
  <data:comment.timestamp/>
  <b:include data='comment' name='commentDeleteIcon'/>
  </div>
  <div class='clear'/> 
  </div>

 <p><data:comment.body/></p>
  <span style='text-align:center; font-size:9px;'>Terimakasih <b><data:comment.author/></b> atas Komentarnya di <b><data:post.title/></b></span>
  </dd>
  </b:if>
  </div>
  </div>
  </b:if> 
  </b:loop>
  </div>
 <div class='cm_pagenavi' id='cm_page_copy'/>
  
  <b:if cond='data:post.embedCommentForm'>
  <b:if cond='data:post.allowNewComments'>
  <b:include data='post' name='comment-form'/>
  <b:else/>
  <data:post.noNewCommentsText/>
  </b:if>
  <b:else/>
  <b:if cond='data:post.allowComments'>
  <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
  </b:if>
  </b:if>
 </b:if>
  </div>


ganti no blog 00000000000 dengan no blog no teman .
save template


9 komentar:

  1. :a2 :a1 mantaf banget infonya sobat, saya coba di blog saya ternyata memang berfungsi, semangat terus postingnya, sangat bermanfaat lihat saja di blog saya, buktinya Grosirnet :a2 :a9

    BalasHapus
  2. Website Download Film Gratis dan Download Film Baru Dilengkapi Dengan Subtitle Indonesia, Link Full Speed Paling Update Terlengkap Dan Bisa Request Free Movie Download
    Pusat Film

    BalasHapus