Membuat Kotak Komentar Bertingkat Dengan Kaskus Emoticon

5 Mar 2014

TutorNesia ~ Sistem Komentar Hack Bertingkat Full Emoticon Gif ini sudah saya modifikasi dengan penampakan 3 dimensi dan tutorial ini saya ambil dari blog.kangismet.net dengan kata lain Style Blogger Threaded Comment. Beberapa kelebihan yang terdapat pada komentar ini sudah saya perbarui dengan emoticon gif dan telah lulus valid HTML5.

Namun soal SEO saya sendiri masih dalam tahap belajar, atau anda boleh kunjungi blog kompi ajaib. Sudah tidak menjadi rahasia kalau om kompi memang sering membahas valid-validan. Anda dapat melihat foto admin kompi ajaib yang rambut kerontokan karena setiap hari melihat kodi-kodi dan mencari-cari masalah SEO hehehe.

Kelebihan:

Tanpa Pop up.
Installasi lebih mudah.
Bisa menampilkan kode, gambar dan file youtube.
Emoticon dengan gif model bawang.
Klik disini untuk melihat DEMO

Sebelum melakukan installasi pastikan Backup dulu template anda untuk menjaga-jaga bila terjadi kesalahan.

01. Masuk ke Blogger dan klik HTML
02. Ganti semua kode ini.

<b:include data='post' name='threaded_comments'/>

dengan ini:

<b:include data='post' name='comments'/>

Jika tidak ditemukan, lanjutkan ke langkah berikutnya.

03. Ganti semua kode antara <b:includable id='comments' var='post'> dan </b:includable>, gambarannya seperti bawah ini:

<b:includable id='comments' var='post'>
KODE PANJANG YANG HARUS DIGANTI....
</b:includable>

<style type='text/css'>
#comments {}
#comments h3 {margin-bottom:15px;font-size:18px;}
.comment_avatar_wrap{
width:42px;
height:42px;
border: 1px solid #C4C4C4;
border-top-color: #E4E4E4;
border-left-color: #E4E4E4;
background:#fcfcfc;
padding:4px;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
text-align:center;
margin-bottom:20px;
box-shadow:-2px 4px 12px #444}
#comments .avatar-image-container {
float: left;
margin: 0 10px 0 0;
width: 42px;
height: 42px;
max-width:42px;
max-height:42px;
padding: 0;
margin-bottom:10px;}
#comments .avatar-image-container img {
width: 42px;
height: 42px;
max-width: 42px;
max-height: 42px;
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQBLUwT05MzyVxl7yrb4ss3CDT97WfUwmVpXLYJplj2Mnd3HSgB4AtiEDkKdcivIRsA-Nu0tKAAiXfjaErASDuWZYLsEmrclLQrujWPWri2dCnUXN5Gn145pDIQZ7zxgqLXANVYTjz1elN/s1600/anon.jpg) no-repeat;}
.comment_name a {
font-weight: bold;
padding: 5px 0 0 0;
font-size: 13px;
text-decoration: none;
}
.comment_admin .comment_name  {
font-weight: bold;
padding: 10px;
font-size: 13px;
text-decoration: none;
background:#E8E8E8;
box-shadow:-2px 4px 12px #444}
.comment_admin .comment_date  {
font-weight: normal;
font-size:11px;
}
.comment_name {
background:#f0f0f0;
padding:10px;
font-size:13px;
font-weight:bold;
box-shadow:-2px 4px 12px #444}
.comment_service{
margin-top:5px
}
.comment_date {
color: #a9a9a9;
float:right;
font-size:11px;
font-weight:normal;
margin-top:2px;
}
.comment_body{
margin-top:-72px;
margin-left:66px;
background:#fcfcfc;
border:1px solid #ddd;
padding:10px;
-webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;box-shadow:-2px 4px 12px #444}
.comment_body p {
line-height: 1.5em;
margin: 5px 0 0 0;
color: #666;
border:1px solid #f1f1f1;box-shadow:-2px 4px 8px #444;
font-size: 13px;
word-wrap:break-word;
background:#fff;
padding:10px;
}
.comment_inner {
padding-bottom: 5px;
margin: 5px 0 5px 0;
}
.comment_child .comment_wrap {padding-left: 7%;}
.comment_reply {
display: inline-block;
margin-left:-5px;
padding: 1px 11px;
border: 1px solid #C4C4C4;box-shadow:-2px 4px 12px #444;
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;
}
.comment_reply: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%);
}
.unneeded-paging-control {display: none;}
.comment-form {max-width: 100%;!important;}
#comment-editor {width:101%!important}
.comment_form a {
text-decoration: none;
text-transform: uppercase;
font-weight: bold;
font-family: Arial, Helvetica, Garuda, sans-serif;
font-size: 15px;
}
.comment_form a:hover {text-decoration: underline;}
.comment-form p {
background: white;
padding: 7px 10px 7px 10px;
margin: 5px 0 5px 0;
border: 1px solid #C3D7E2;
color: #888;
font-size: 13px;
line-height: 20px;
width:96%;
}
.comment_reply_form {
padding: 0 0 0 70px;
}
.comment_reply_form .comment-form {width: 99%;}
.comment_emo_list .item {
float: left;
text-align: center;
margin: 10px 10px 0 0;
height: 40px;
width:41px;margin-bottom: 28px;
}
.comment_emo_list span {
display: block;
font-weight: bold;
font-size: 11px;
letter-spacing: 1px;
}
.comment_emo_list span {
display: block;
font-weight: bold;
font-size: 11px;
letter-spacing: 1px;
}
.comment_youtube {max-width:100%!important;width:400px;height:225px;display:block;margin:auto}
.comment_img {max-width:100%!important;}
.deleted-comment {
padding: 10px 10px 10px 10px;
display: block;
color: #CCC;
}
.comment_arrow {
display: block;
width: 9px;
height: 18px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEizteDTDorZE5gcBfU4NSAOdP8GS5e99yqwcH_kjKdK-dk1AjlFtAKEP8ZrcRriLpuItdQ51x-O2-f1Ljm-UUEgycpX-rTHzLmMDTMZSkGiMN6yZwo6RbwWaukyuBhjk7kYISUto6VIAFs/s1600/comment-arrow.gif) no-repeat;
position: absolute;
margin-left: -19px;
}
.comment_header{width:50px}
#respond {
overflow: hidden;
padding-left: 10px;
clear: both;
}
.comment-delete img{float:right;margin-left:10px;}
#comment-editor{width:103%!important}
.comment-form{width:100%;max-width:100%}
#iframe{overflow:hidden}
</style>

<div class='comments' id='comments'>
    <a name='comments'/>
 <b:if cond='data:post.allowComments'> 
  <b:if cond='data:post.numComments != 0'>
   <h3>
    <b:if cond='data:post.numComments == 1'>1 <data:commentLabel/>:
     <b:else/>
     <data:post.numComments/> <data:commentLabelPlural/>
    </b:if>
   </h3>
  </b:if>
               
  <b:if cond='data:post.commentPagingRequired'>
   <span class='paging-control-container'>
    <a expr:class='data:post.oldLinkClass' expr:href='data:post.oldestLinkUrl'><data:post.oldestLinkText/></a>
    &#160;
    <a expr:class='data:post.oldLinkClass' expr:href='data:post.olderLinkUrl'><data:post.olderLinkText/></a>
    &#160;
    <data:post.commentRangeText/>
    &#160;
    <a expr:class='data:post.newLinkClass' expr:href='data:post.newerLinkUrl'><data:post.newerLinkText/></a>
    &#160;
    <a expr:class='data:post.newLinkClass' expr:href='data:post.newestLinkUrl'><data:post.newestLinkText/></a>
   </span>
  </b:if>
                       
  <div class='clear'/>
  <div id='comment_block'>
   <b:loop values='data:post.comments' var='comment'>
                                                                             
   <div class='comment_wrap' expr:auclass='data:comment.adminClass' expr:id='data:comment.anchorName' level='0'>                                                                                     
     <a expr:name='data:comment.anchorName'/>
      <b:if cond='data:post.adminClass == data:comment.adminClass'>
       &lt;div class=&#39;comment_inner comment_admin&#39;&gt;
       <b:else/>
                            &lt;div class=&#39;comment_inner&#39;&gt;
      </b:if> 
    
    <div class='comment_header'>
                               <div class='comment_avatar_wrap'>
     <div class='comment_avatar'>
      <data:comment.authorAvatarImage/>
                                 </div>
<a class='comment_reply' expr:href='&quot;#r_&quot;+data:comment.anchorName' expr:id='&quot;r&quot;+data:comment.anchorName' onclick='javascript:Display_Reply_Form(this)'>Balas</a>
     </div>
                         
     <div class='clear'/>
    </div> 
         
    <div class='comment_body'>
                                      <span class='comment_arrow'/>
     <div class='comment_name'>
      <b:if cond='data:comment.authorUrl'>
       <a expr:href='data:comment.authorUrl' rel='nofollow' target='_blank'><data:comment.author/></a>
       <b:else/>
       <data:comment.author/>
      </b:if>       
                  <span class='comment_service'>
                      <b:include data='comment' name='commentDeleteIcon'/>
      <span class='comment_date'><abbr class='published' expr:title='data:post.timestampISO8601'>                   <data:comment.timestamp/></abbr></span>
  </span></div> 
     <b:if cond='data:comment.isDeleted'>
      <span class='deleted-comment'><data:comment.body/></span>
      <b:else/>
      <p><data:comment.body/></p>
                        <div class='clear'/>
                      
     </b:if>
                                                      
    </div>                         
     <div class='clear'/>
     &lt;/div&gt;
     <div class='clear'/>
           
    <div class='comment_child'/>
    <a expr:name='&quot;r_&quot;+data:comment.anchorName'/>
    <div class='comment_reply_form' expr:id='&quot;r_f_&quot;+data:comment.anchorName'/>              
    </div>
   </b:loop>              
   </div>    
    <div class='clear'/>
    <b:if cond='data:post.commentPagingRequired'>
     <span class='paging-control-container'>
       <a expr:class='data:post.oldLinkClass' expr:href='data:post.oldestLinkUrl'><data:post.oldestLinkText/></a>
       &#160;
       <a expr:class='data:post.oldLinkClass' expr:href='data:post.olderLinkUrl'><data:post.olderLinkText/></a>
       &#160;
       <data:post.commentRangeText/>
       &#160;
       <a expr:class='data:post.newLinkClass' expr:href='data:post.newerLinkUrl'><data:post.newerLinkText/></a>
       &#160;
       <a expr:class='data:post.newLinkClass' expr:href='data:post.newestLinkUrl'><data:post.newestLinkText/></a>
     </span>
    </b:if>
    <div class='clear'/>
  <div class='comment_form'>         
         
   <b:if cond='data:post.embedCommentForm'>
    <b:if cond='data:post.allowNewComments'>
     <h3 id='comment-post-message'><data:postCommentMsg/></h3>
      <div class='comment_emo_list'/>                                                                                              
       <b:include data='post' name='threaded-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>
  </div>
 </b:if>
</div>

                   
       <script type='text/javascript'>
       //<![CDATA[
       if (typeof(jQuery) == 'undefined') {
 //output the script (load it from google api)
 document.write("<scr" + "ipt type=\"text/javascript\" src=\"http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js\"></scr" + "ipt>");
}
       //]]>
       </script>
     
       <script async='async' expr:src='data:post.commentSrc' type='text/javascript'/>
       <script type='text/javascript'>
      
         <b:if cond='data:post.numComments != 0'>
         var Items = <data:post.commentJso/>;
         var Msgs = <data:post.commentMsgs/>;
         var Config = <data:post.commentConfig/>;
        <b:else/>
         var Items = {};
         var Msgs = {};
         var Config = {&#39;maxThreadDepth&#39;:&#39;0&#39;};
        </b:if>
       //<![CDATA[
       //Global setting
        Config.maxThreadDepth = 6;//Kedalaman tingkat threaded comment
        Display_Emo = true;//Tampilkan emoticon? ketik "false" untuk menyembunyikan
        Replace_Youtube_Link = true;//Embed video YouTube, ketik "false" untuk mendisable
        Replace_Image_Link = true;//Auto replace link image,  ketik "false" untuk mendisable.
                                Replace_Force_Tag = true;//Auto replace virtual tag contoh: [pre] menjadi <pre>, dan [/pre] menjadi </pre>, apabila salah menulis, tidak akan berfungsi
        Replace_Image_Ext = ['JPG', 'GIF', 'PNG', 'BMP'];//(support: jpg, gif, png, bmp),hanya berfungsi apabila Replace_Image_Link=true
      
        //Pengaturan Emoticon
        Emo_List = [
        ':)'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEicsQktUieeuvYabnNiNayvZLV3KIPyaRaNox5zcIa17t80y2ou4mO7k3NCzhrlK1nP1oeRjk1hS4Uj_m0buxEkBMQh79iE5RV5wNovNjRu8xCFDi9w7hFibMh9BDKK5xgTanV18aNQlOMa/s1600/q.gif',
        ':('  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj0Dzng6bq1tj9SxlyxBdGPEB4O8o2-N5p9zynhM2X5O-vmCaqpkWRizZQBHH3JUjVin_FZUEObShl7iwL8f_3jsop-4ReNaYV5oyKEIpXaDjshC3h9rzCSWidMLGCd3go9aRRC94l9q8VZ/s1600/d.gif',
        '=('  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgShly7CovLKgwYlACKOjgvxNpi4GwUV7mxS-HPSsXk4JlKkwLacpBIwN6QDvbrlSsw9Gd66Pgnyk4hwxmRFxJPZB6Slvbcw7tvCESqtr05MIwYe2KvBmlwAOfYqxMGE_77LKD8ag93ey9p/s1600/p.gif',
        '^_^'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQP7vxxPRwM5ODsN-RMHcU71BrOlzVdppxa4tEhPtcD_9xBaegr1-EkdduoprSaoKLOJbbFPr-SXTuVI05PU6DBCSgD_wied9GzDk8z43aNfjHyzGgK9LVcnVYXYkl4stP59vGi5AKnUC5/s1600/b.gif',
        ':D'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgkS6bno0jQUfbN52bSR2NaKWYGib4LDsGkLtmRToT5pAWFqYTKuJKWrYYXcY2ESqHIB4oCFuzYuLDDZ2HyAr7EKAiv_LytX2HO8gFIQr6kuUUoxF1V4Kt9cB753hg4nmXImDZSGz0tV1OD/s1600/i.gif',
        '=D'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBES7EKLRuQrk3mlawZvxm1K4LG3eMw1yweg-n0ScauDtQZVodrivLrWmL9QVpcHNPBeWjw0WVj9tpyIjgXbFgBzIT5aUnENuy45QkJs9ABjTYlY7x2OeWi-uaeQXiAITqgdyTEN2aucEj/s1600/iiyada.gif',
        '|o|'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhQuN7SXCLP4AmklTwEbUZmDz2t72Ahe-yojywZjOMT37czJFVk4ujYf9tuwddTnAWUqdoA-71RvtjbRLfku-GexolrGzlQ56VDavL7zgwWLuBqYTg7zDPY13_oYrjaJzBBVDGJVdgQJdYi/s1600/n.gif',
        '@@,'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBYnG-WyBALXg24zQ67tILOLZXH1_XNdJaqXNXq3R4XUISNA25pkhUdBvm9Bb_DQ_H0II-NnWqRIYlREmMARE2Us8lt8_3M4-8JqXGtfI3-NCh3UinR-k1BA_vf30NfIPTJYzE-iWgeY0p/s1600/r.gif',
        ';)'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7FH7ZEWOEFQxHMulNzd51PvgNoQKWeVLIL700qCgYuHq3jS_PLXz83RFf1-zQ08g0L9qDyQSYc1TK96o3UFAvYetJBn80xao7VWACfwWFXIM6NzqWEl6ZCpeDvgMktTJ6FouJnd4kMZ47/s1600/f.gif',
        ':-bd'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhWfYb68Ax7AIFQO_8wJFxKf5Q8fBXgQuCbm8a2BOH5Wxj3f3S9_ItP34sTgUmNN0oEzJf5RZQgO66pByd0rczEYup0uhmFGIG0puGHBRfifDhx9EbcYboeySSxqGPgbnnPTqtRpOSYV0iR/s1600/s.gif',
        ':-d'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjJhI8M5b4eoqkXaIc7C8QnkdNQjc045xmPaLFt6l5tJxg-yO61aK5Tx3MekwO8HA_GFnesb7dLgZAKJXApw_ewR04zBW823JdZK8HBeVw1vzYp0_0p-CsW7vdlbd5APgUgmXRZ6LjrvaD1/s1600/j.gif', 
        ':p'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgv2OtyniJlExBSDrTNVp8hXd9BeFJ6RDc3S5cdhsFZgwBHCgZNjw0cYgIr0O0uLMkOnTgcwVjtsE56rY3vB4llutbb1b-aXcw1Uvkr7CJHkPMxaQ1u3ZqgHLeb1LxN_dmTZUEz4Qc73I6m/s1600/h.gif',     
        ':a'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDwNUxvOkA1cndISlfs_kbg454g-SjNV9xIfb8Q-lwNZ-N4Jby8li3I_Jo0Rvc1cjCO7EA8G63f02bT-s7zduXGoT-yK861GYfxZA6vGoZ2f0V7n2H9hRU4kXPqsHzCE_j6e-OeCIDfxFb/s1600/1.gif',
        ':b'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiOVR0bwDtpGq1ynmeyGGu9IXT99OTKv1Tx2lVN8_pYI7oJS7qlSubPqbfSvmO0f8zauO1YwS9zikgSRbcSVz08gfj6Uj_69PtjW1RnQ4-XlDI0jRdMmdjb7gn3dOiD_kVFCrM6TenEx5PH/s1600/2.gif',
        ':c'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxlojcjCQWijjCM2CS-Qo8FWwsjfy9qjvBAJ9o86fvUB9z_yQffFCibMtvq8kbm5EMdXVyQaRObxNzSYXLzevGO8SNb3Aq0EfAFa2AN6VtDGSyn5wqslkPRAww-JOOoTsDBZ53HZqa7nvw/s1600/3.gif.gif',
        ':aa'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmQBFYBPhvekj8j7v91tGWGRE0ko0lLBQvCSrPuk2w8ExGvT4T1diAKPrsMVbhBqKa7nkengPze8K9z0zWS0h0RD3qlAkLyKj5JdZduZRssLjpYdgD4jQZgnRjycwNrBCqx5q20IbOUwUY/s1600/4.gif.gif',
        ':bb'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvmG2VNm_7hr-9vAvQa3Y_ACBFbSaO95Mityqf_hAV5k1s8H7LlOOb5qVIkSKGeJ3fRmnYXTRzES0WyJ80hsViWhU-ROKYh9qvtdTLmvstAtzNCsYDHVSPRnFHWzKU58jHG6-f7dx5YDeh/s1600/5.gif',
        'cc'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjmbYv4r1jBJPvw-VfZykIQUsDA28Tjt2PXiyZXDJs_chwlgw8spG9QmzTJnx7EDsMHuNACK6dkyUL6HN7I7B3x97OmrkIPkNae5YuGZ4vkMPjiWq0OCwVq7gS_6MPMZOTKFAhPMLWiSNsK/s1600/6.gif',
        ':-aa'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh-GGcwwy_OIcKX9KqPafwjl7jOwa_wrnqIEmyEvzs2AUYoYaUtrXrVVUyPb2e_Emw_HD45y39qoLP2MeEZB7mKC0Lzx-N7t_rYEkC0DrRe040hUsdotK6voUl8r0upqoiao3i8ORCC_eK8/s1600/7.gif',
        ':-bb'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhKX6x66-J8XGH8ru5OCpoWRmY-9T2iHQJbyO1C5AOOQGHYwdLI0ult_a6yuo_PO6WNtwf3HsQ-VcOOX9xJDzSvMF049hfnd3Eq5LxH-uzug_Kj-ZLNiS2KOlbuw1sG98dxlDho7Bc1b6hv/s1600/8.gif',
        ':-cc'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhc_PyAoQfExG-ANfKbVRrbvM8FzoDepzOJg4v3wUX99TvUwXX6kHXO3T3ynQdLWHFrSZgWmsLD74DT_0AoNbM0zsxHKL6LSCoLQdkIFdGTb9Tr1tBD-AquTVDZkGGVbrS0Fhkef0skSJ15/s1600/9.gif',
        ':,a'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8bb0sRgWqTOl0eFGbdeEAfteobT3DdGrplnDCVBk-wBNzJ6uUAlx73n6Xe65qdoahsbl9f6pU6vWMi_G42pF-2onaUiZuqW4-3EvRL7Ps2uQfIV0xjITOw6FnI_cP52NmcH-0w-tmGjmd/s1600/10.gif',
        ':,b'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhYmo-qOl-JE2BtR6Zc1np4TVzEruh9RqbGuOZuAP-UzGrHb0dSwtMSE7SBS54g2U7RShL_kvjgPc_rYhDZ_eW7qtEdh3NdqYUi-yyXEbRW9Q3V_PGTTbBil-wP_jVFm_myLHgB5l6W_ove/s1600/11.gif', 
        ':,c'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHqieDVNHQ6KkqS9fEAF4cwbmF7rjDwauIob8xaR6y12obsXEko8NF7DWG2OjrxBZNBChvy-ELrwRbIKojFTBJOGhbEWdrXNicfB3K7WOA7TbpQ6PMO5_PZiZ1KoCu5VdCXlalWCXEJggR/s1600/12.gif',     
        '-:)'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_uBp5vx13vIH83spU2cbVHEsz8KLYsPQ-qjtUpkhwBr-SwyRZKJXYF1lTKNovetT_S-j_32fbUgIBkJtK2iGJUDUl6NJUOFirWpOqsRFDgXsYWayD-u1BGcxeeDtz2LflBgWAfb26Y2j8/s1600/dead.gif',
        '-:('  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhkVpoLV-Okvp83hEXug0tzO9wubfj6Gjprkh992e0KJb-c-uK9blMFG5dcKueIhefooyWYbFSNOg7W4dLD7DGiNZo93_rT8NurqUbcw6go9TILKErTBx0CVRGUsAu0SxeZxu22Cgtz4lRJ/s1600/dry.gif',
        '=ab'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEixTMnoNGSeSTS5jOmCBrpTXnbFVH6BsRYWXMjflK6zd5oyeNNXWoSZev3oeXAGBB4XKpLk-9N9PZ-axZQwyM8O9fQ7QCt45i_ptJZnqN2_7UI_d_aXUhzQ1Rti9Vg5IkfcpGaa9DI0r78i/s1600/eat.gif',
        '-:h'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgR2tqEduc8OrkowUSqxyxMZk6oQFJW-38pBK6Bs_uDihlQKQsgaMMFmcTsImFL0gpIxgod7wgLkLwhsJcztVhSW3CRnnR2YOR-qJ8Q4BuxLE1qzerstKibY5V7VONm1vx7V8lXxMNSR8cZ/s1600/happy.gif',
        '-_-'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjaLYZ8O07v2J9T7DfBDXpSln_W3WcI5Emm5NFFY4KdWz_2iF7Ji8NnJOJyRcxnnEp1T5lja_7G8pXoDpy2WS07CR9YnDVpYVRvbljQt1XE8gjMrp7FFaRCajb1kwZV2EcAg6q4NKOsV_M-/s1600/hun.gif',
        '-:m'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgBXyM-AE7Dm717zgszedXYF_VG9FP5GAW8FFoZElkYizwrDKsYfEZkSglRm3xI4gbi5LU0EESlm1DMLEz7QN_hboT2qyltA5Gv2cWK6xpcUAEeJnyS_5070FG5zwyxB6UxHtMR6YqHXPCo/s1600/mad.gif',
        '-:r'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1GB7LVcDoPznr-SBF7U3xOrk3uhbv6-ZbmB_GE5Yin0sVE1a5SzESSuYdNbImppGfF1DVoCO17QCpz9om-46AdFbceFCRzyehjaPjtrQk78LCjt5fwr_A2kGzTS75-LnmenzIBbrDEam1/s1600/rain.gif',
        '-:k'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh1U3798tQLms7VlIq27hDR0c-3qg6Y_aI_4H7J0dLwPD2hyphenhyphenkI_S6AOpCt-wISCOEhRQqdLP-uYSb5dqDWPH5XUe934_lzGRWGzr2K7_rX70486upk3feojO91yKivfthjjkF2gTtS5OqSB/s1600/redc.gif',
        '-:s'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgYiO3LrHjPydltn1uBfh2cgW8EH1r6FF5sW0CxrFFwD_z5KDoa8nN9LO0yr6rNB2fNSgD1Cc6Nm4VL1aazdQjS42jhRRwqfKzLG-p7SnhcRiflullc5rKZ4hcXEM7OAPF4vhgb29TONdaj/s1600/shineee.gif',
                       ':kk'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjSy8Q5eM0L9fAXOVcCe7ceGXNw5sn7Fo2NLJoyY5OaO2FmsLfH3vRmM0aWJ7oZAJPuWUea9MSdACndGLZqfw-2gg9MkulbVaEywCfZcZfUjsvDPrTx_vKaq5PuNa25QccpJAQAoEl5meU3/s1600/shiver.gif',
        '-:nn'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhw4tzQpHbpg5ea_xcqPmQaEl-lLvg417_VV4QiZjH0q4lxXNGSKzi1RU7EKUlHoj-8I-Ab5CZzzWTbhlCzsn17wt18ftjaqc2oI7AIBOq5AreBXHiynp6mA4DlLy6bSOcVzLE0AC5vn7yB/s1600/shock.gif', 
        '-:)('  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhPRI3TcggRHrnNovKxrPaHvfsvZYL_Tbr87iWpAOHhegLSKei_Myz9H2OlFARWJuyZtOq38nHSN3Z7ei2K4sBl7WSSA8jJvMESZG-u3mUWJS9iPEDOgZEEZCB79ik9C3_2bVMoVNp7ca4/s1600/swt.gif',     
        ]; 
      
                             
                                //Config Force tag list, define all in lower case
                                Force_Tag = [
                                    '[pre]','<pre>',
                                    '[/pre]','</pre>',
                                    '<pre class="brush: plain; title: ; notranslate" title="">','&lt;code&gt;',
                                    '</pre>','</code>'
                                ];
    
eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('3 o=\'.1c\';3 1b=$(\'#O-19\').G(\'A\');u 1l(F){3 1j=\' \\n\\r\\t\\f\\1D\\1G\\1F\\1E\\2l\\2k\\2i\\2f\\2c\\26\\25\\23\\1Y\\1S\\1N\\1L\\1H\\2v\\1M\\2p\\24\\22\\1R\';E(3 i=0;i<F.5;i++){9(1j.d(F.1Q(i))!=-1){F=F.b(0,i);11}}z F}$(\'#1P .1i p\').j(u(y,7){9(1J){3 l=\'1v://13.V.W/1y?v=\';3 8=7.d(l);D(8!=-1){1d=7.b(8);J=1l(1d);3 X=J.d(\'&\');3 N=\'\';9(X==-1){N=J.b(l.5)}Y{N=J.b(l.5,X)}3 1r=\'<1u B="1T" A="1v://13.V.W/1U/\'+N+\'?1V=1" 1W="0" 2w></1u>\';7=7.b(0,8)+1r+7.b(8+J.5);8=7.d(l);9(8==-1){l=\'1Z://13.V.W/1y?v=\';8=7.d(l)}}}9(21){3 Z=\'\';3 s=7;E(3 i=0;i<1w.5;i++){3 l=\'.\'+1w[i];3 m=s.C();3 8=m.d(l);D(8!=-1){k=s.b(0,8+l.5);m=k.C();3 q=\'2h://\';3 w=m.d(q);3 I=\'\';D(w!=-1){I=q.M();k=k.b(w+q.5);m=k.C();w=m.d(q)}q=\'2n://\';m=k.C();w=m.d(q);D(w!=-1){I=q.M();k=k.b(w+q.5);m=k.C();w=m.d(q)}9(I==\'\'||k.5<6){11}k=I+k;Z+=s.b(0,8+l.5-k.5)+\'<10 A="\'+k+\'" B="2r"/>\';s=s.b(8+l.5);m=s.C();8=m.d(l)}}7=Z+s}9(1A){3 5=x.5;9(5%2==1){5--}E(3 i=0;i<5;i+=2){3 S=\'<10 A="\'+x[i+1]+\'" B="1B"/>\';8=7.d(x[i]);D(8!=-1){7=7.b(0,8)+S+7.b(8+x[i].5);8=7.d(x[i])}}}9(1I){3 5=R.5;9(5%2==1){5--}E(3 i=0;i<5;i+=2){D(1){3 s=7.M();8=s.d(R[i]);9(8!=-1){7=7.b(0,8)+R[i+1]+7.b(8+R[i].5)}Y{11}}}}z 7});$(\'.1K\').j(u(y,7){9(1A){3 5=x.5;9(5%2==1){5--}3 12=\'\';E(3 i=0;i<5;i+=2){3 1e=\'<1f>\'+x[i]+\'</1f>\';3 S=\'<10 A="\'+x[i+1]+\'" B="1B"/>\';12+=\'<Q B="1O">\'+S+1e+\'</Q>\'}z 12}});$(\'.1g .1i p\').j(u(i,h){T=h.M();y=T.d(\'@<a U="#c\');9(y!=-1){14=T.d(\'</a>\',y);9(14!=-1){h=h.b(0,y)+h.b(14+4)}}z h});u 1k(g){r=g.d(\'c\');9(r!=-1)g=g.b(r+1);z g}u 1m(g){g=\'&1X=\'+g+\'#%1n\';1o=1b.20(/#%1n/,g);z 1o}u 1p(){j=$(o).j();$(o).j(\'\');o=\'.1c\';$(o).j(j);$(\'#O-19\').G(\'A\',1b)}u 1q(e){g=$(e).G(\'15\');g=1k(g);j=$(o).j();9(o==\'.1c\'){1s=\'<a U="#1t" 27="1p()">\'+28.29+\'</a><a 2a="1t"/>\';$(o).j(1s)}Y{$(o).j(\'\')}o=\'#2b\'+g;$(o).j(j);$(\'#O-19\').G(\'A\',1m(g))}16=2d.2e.U;17=\'#O-2g\';18=16.d(17);9(18!=-1){1x=16.b(18+17.5);1q(\'#2j\'+1x)}E(3 i=0;i<P.5;i++){9(\'1z\'2m P[i]){3 g=P[i].1z;3 1a=2o($(\'#c\'+g+\':L\').G(\'1C\'));$(\'#c\'+g+\' .2q:L\').j(u(y,7){3 H=P[i].15;9(1a>=2s.2t){$(\'#c\'+H+\':L .2u\').1h()}3 K=$(\'#c\'+H+\':L\').j();K=\'<Q B="1g" 15="c\'+H+\'" 1C="\'+(1a+1)+\'">\'+K+\'</Q>\';$(\'#c\'+H).1h();z(7+K)})}}',62,157,'|||var||length||oldhtml|check_index|if||substring||indexOf|||par_id|||html|img_src|search_key|upper_html||Cur_Cform_Hdr||http_search||temp_html||function||find_http|Emo_List|index|return|src|class|toUpperCase|while|for|str|attr|child_id|save_http|yt_link|child_html|first|toLowerCase|yt_code|comment|Items|div|Force_Tag|img_html|temp|href|youtube|com|yt_code_index|else|save_html|img|break|newhtml|www|index_tail|id|cur_url|search_formid|search_index|editor|par_level|Cur_Cform_Url|comment_form|ht|img_code|span|comment_wrap|remove|comment_body|whitespace|Valid_Par_Id|trim|Cform_Ins_ParID|7B|n_cform_url|Reset_Comment_Form|Display_Reply_Form|yt_video|reset_html|origin_cform|iframe|http|Replace_Image_Ext|ret_id|watch|parentId|Display_Emo|comment_emo|level|x5b|x7d|x7c|x5d|u2008|Replace_Force_Tag|Replace_Youtube_Link|comment_emo_list|u2007|u200a|u2006|item|comment_block|charAt|u3000|u2005|comment_youtube|embed|autohide|frameborder|parentID|u2004|https|replace|Replace_Image_Link|u2029|u2003|u2028|u2002|u2001|onclick|Msgs|addComment|name|r_f_c|u2000|window|location|xa0|form_|HTTP|x0b|rc|x3e|x3c|in|HTTPS|parseInt|u200b|comment_child|comment_img|Config|maxThreadDepth|comment_reply|u2009|allowfullscreen'.split('|'),0,{}))      
              
       //]]>
         </script>

04. Setelah tahap atas telah anda lakukan, sekarang masih dalam di Edit HTML, pastekan CSS dibawah ini sebelum ]]></b:skin>.

/*-- Modifikasi Pesan Komentar--*/
#threaded-comment-form p {position: relative;background: #4085b8;box-shadow:-2px 2px 8px #444;border: 3px solid #5899c9;padding: 10px;font-size: 13px;line-height: 1.6em;color: #fff;margin-top: 10px;font-size:13px;border-radius:4px 4px 4px 20px;}
#threaded-comment-form p::after, #threaded-comment-form p::before {top: 100%;border: solid transparent;content: " ";height: 0;width: 0;position: absolute;pointer-events: none}
#threaded-comment-form p::before {border-top-color: #5899c9;border-width: 15px;left: 10%;margin-left: -35px;}
#threaded-comment-form p::after {border-top-color: #4085b8;border-width: 10px;left: 10%;margin-left: -30px}
#comment-editor{width:103%!important}
.comment-form{width:100%;max-width:100%}

05. Simpan Template anda.

1 komentar:

Balas

7:25 PM, Mei 05, 2014

ini baru kotak comen bagus sekaliiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiii..,,,,,,,, trim..........................s

Berkomentarlah :

1.Dengan kata-kata yang sopan
2.Tidak menaruh link aktif ataupun non aktif
3.No spam, no sara, and no porn
4.Tidak promosi blog
5.Komentar yang tidak sesuai dengan isi konten akan langsung saya hapus
6.Komentar yang bagus akan saya publish dan saya beri komentar balik

Membuat Kotak Komentar Bertingkat Dengan Kaskus Emoticon

1 komentar:

Contact Support

Link Terkait

Followers

Site Info