Cara Membuat Threaded Coment Hack Style Valid HTML5

Cara Membuat Threaded Koment Style Valid HTML5. Salam sobat blogger? dalam kesempatan kali ini saya akan memeberikan tutorial cara membuat Threaded Comment style Valid HTML5, threaded comment hack seprti ini banyak sekali di cari para blogger yang ingin memodifikasi kotak komentar di blog mereka, maka dari itu untuk kali ini saya akan membuat tutorialnya khusus untuk sobat blogger yang ingin kotak komentarnya bisa lebih bergaya, untuk komentar seperti ini juga sangat ringan untuk di gunakan, jadi kita tak usah menunggu lama untuk lebih bicara lebih panjang lagi, mari kita melakukan tutorialnya langkah demi langkah.

Cara Membuat Threaded Koment Hack Style Valid HTML5

Gambar di atas adalah tampilan komentar yang nanti akan tampil di blog sobat setelah sobat memodifikasi komentarnya, oke sekarang kita langsung ke cara merubahnya.

Cara Membuat Threaded Comment Hack Style Valid HTML5
  • Silahkan Backup template terlebih dahulu.
  • Buka akun blogger sobat.
  • Pilih menu Template > Edit HTML.
  • Silahkan sobat cari kode seperti di bawah ini.
<b:include data='post' name='threaded_comments'/>

Kemudian ganti semua kode tersebut dengan kode di bawah ini.

<b:include data='post' name='comments'/>
  • Berikutnya sekarang sobat cari kode seperti di bawah.
<b:includable id='comments' var='post'>...</b:includable>
  • Kalo tidak ketemu, silahkan cari <b:includable id='comments' var='post'> , Kalo sudah ketemu silahkan ganti semua kode dengan kode di bawah ini, sampai tag penutup </b:includable>
<b:includable id='comments' var='post'>
<style type='text/css'>
  #origin_cform{font-family:&#39;Oswald&#39;,sans-serif;}
  #comments {line-height:1.4em;margin: 60px 0 15px 0;position:relative;background:#2a3542;border-radius:4px;padding:25px 20px 0 20px;font-family:&#39;Open Sans&#39;,sans-serif}
  #comments h3 {border-radius:4px 4px 0 0;font-size:14px;font-family:Oswald,Arial,Sans-Serif;text-transform:uppercase;font-weight:normal;left:0;top:-43px;background:#22afa4;color:#fff;width:85%;padding:14px 20px 14px 75px;position:absolute}
#comments h3:before {
 content: &quot;\f0e6&quot;;
 font-family:fontAwesome;
 font-size:22px;
 font-style: normal;
 background-color:#1a857d;
 color:#fff;
 border-radius:5px 0 0 4px;
 top:2px;
 left:0;
margin-top:-1px;
 padding:13px 20px 12px 20px;
 position:absolute;
}
.comment_avatar_wrap{
width:42px;
height:42px;
border: 1px solid #151d26;
background:#25303c;
padding:4px;
text-align:center;
margin-bottom:20px;
}
#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/AVvXsEjNDK84sZs1bZn-eJ0goDznjRvFoBhYN7nt_J2QOdgifgvfPLBu_R3oQvxlGptrsYit37peJfmbmh-dA4dFCZHW0YX2TGgj8yRlFzF36iGVgTURHbf5BSKoWraB7_eeegsJd3hu8f-Kn27x/s1600/anon.jpg) no-repeat;
}
.comment_name a {
color:#21afa4;
font-family:Oswald, Arial, Sans-serif;
padding-bottom:10px;
font-size:14px;
text-decoration: none;
}
.comment_name a:hover {
color:#c94e5c;}
.comment_admin .comment_name  {
font-family:Oswald, Arial, Sans-serif;
padding-bottom:10px;
font-size:14px;
text-decoration: none;
}
.comment_admin .comment_date  {
font-weight: normal;
font-size:11px;
}
.comment_name {
font-family:Oswald, Arial, Sans-serif;
padding-bottom:10px;
font-size:14px;
font-weight:normal;
position:relative;
}
.comment_service{
margin-top:5px
}
.comment_date {
color: #999;
float:right;
font-size:11px;
font-weight:normal;
}
.comment_date a{
color: #a9a9a9;
float:right;
font-size:11px;
font-weight:normal;
}
.comment_date a:hover{
color: #a9a9a9;
text-decoration:none;
}
.comment_body{
margin-top:-72px;
margin-left:65px;
background:#25303c;
border:1px solid #1d2630;
border-top:1px solid #171f28;
border-left:1px solid #171f28;
padding:15px;
}
div.comment_inner.comment_admin{
background:#394549;
}
.comment_body p {
line-height: 1.5em;
margin: 5px 0 0 0;
color: #999;
font-size: 13px;
word-wrap:break-word;
padding-bottom:10px;
}
.comment_inner {
padding: 15px;
margin: 5px 0 5px 0;
background-color:#35404d;
}
.comment_child .comment_wrap {padding-left: 5%;}
.comment_reply {
display: inline-block;
margin-top:8px;
margin-left:-5px;
padding: 1px 12px;
color: #fff !important;
text-align: center;
text-decoration: none;
border-radius: 2px;
background: #54687c;
font: 11px/18px sans-serif;
transition: background-color 1s ease-out 0s;
}
.comment_reply:hover {
text-decoration: none !important;;
background: #627c96;
}
.unneeded-paging-control {display: none;}
#comment-editor {width:100% !important;background:#e1e3e6 url(&#39;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhanRK_eeu8kdWzWk4gVE9jnfMHSgNtHqBsKl3MC4HedopeyWwkPteC77OJzaxxAtbf-25z5jxMO7EZgURsKPKQsNtatWUrWZiTz3LdzKgrsuiXvDgjKYPQcGgvZyL-FJn1IMSBqNfSkv8/s1600/kangis-loader.gif&#39;) no-repeat 50% 30%;border-radius:4px;margin-bottom:20px;position:relative;}
.comment-form {max-width: 100% !important;}
.comment_form a {
    margin-bottom:8px;
text-decoration: none;
font-weight: normal;
font-family:&#39;Oswald&#39;,sans-serif;
font-size: 15px;
text-align:center;
    color:#54687c;
}
  .comment_form a:hover {text-decoration: none;color:#f2f2f2}

.comment_reply_form {
padding: 0 0 0 70px;
}
.comment_reply_form .comment-form {width: 99%;}
img.comment_emo {margin:0;padding:0;vertical-align:middle}
.comment_emo_list{
display:none;
}
.comment_emo_list .item {
float: left;
text-align: center;
margin: 10px 10px 0 0;
height: 40px;
width:41px;
}
.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;}

.comment_header{width:50px}
#respond {
overflow: hidden;
padding-left: 10px;
clear: both;
}
.comment_avatar img{width:42px;height:42px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjNDK84sZs1bZn-eJ0goDznjRvFoBhYN7nt_J2QOdgifgvfPLBu_R3oQvxlGptrsYit37peJfmbmh-dA4dFCZHW0YX2TGgj8yRlFzF36iGVgTURHbf5BSKoWraB7_eeegsJd3hu8f-Kn27x/s1600/anon.jpg) no-repeat}
.comment-delete img{float:right;margin-left:15px;margin-top:3px;}
.comment_author_flag {display:none}
.comment_admin .comment_author_flag {display:inline;font-size:13px;font-weight:normal;padding:2px 6px;right:-23px;margin-top:-23px;color:#fff;border-radius:4px;text-transform:uppercase;position:absolute;width:36px;height:36px;}
iframe{border:none;overflow:hidden}
.deleted-comment {
background:#db6161 url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGrUZpetPQ3xy0B3MT7JaKwePnZf8fY-O2dW9MkWj5uUPwVIRRvyl1MaXzHXF7d3vqdJPx8k23UhYoogPYoaXO7nfkCRh3oOQ6zIZjxIq8FuYiFqTNN_qpSrzdGR1bbQZeqRQ0pNuIDVg/s1600/tempat-sampah.png) no-repeat 2% 50%;
color:#efd4d4;
line-height: 22px;
border: 1px solid #c44d4d;
padding:12px 15px 12px 45px;
margin:5px 0;
display: block;
}
.comment-form p {
background: #54687c;
padding: 15px 15px 14px 15px;
margin: 5px 0 5px 0;
color: #f4f4f4;
font-size: 13px;
line-height: 20px;
border-radius:4px;
position:relative;
}
div.comment_avatar img[src=&#39;http://img1.blogblog.com/img/openid16-rounded.gif&#39;] {
content: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDyu_6LmB438CctbobRNu1rtA-wBV61bxd-96FRZO09oxH8DQmbakAcMxTbD3VaPQvPrrPF6EZpbPPx2_kFkq09oOoOXT70z1llP9wv8Ujjs9uTZnRm4qOC3Ki5YzUXIK2zn9TprNJS3U/s45-c/gravatar.png);
}
  div:target .comment_inner{background:#346656;transition:all 15s ease-out;}
div:target .comment_child .comment_wrap .comment_inner{background:#404c5c;} 

iframe{border:none;overflow:hidden}

.center {
 text-align:center
}

img.cm-prev {
  max-width:100%;
  margin:10px auto;
  page-break-after:always;
  display:block;
  text-align:center !important;
}
</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'/>
<a class='comment-delete' expr:href='data:comment.deleteUrl' title='Hapus komentar jelek ini'>
<img alt='delete' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjK13jYpCIQiGW21A7xLJwaxfMSH6yu3gJdW2Z2KyeZBsqrJE8DboZiaiNczMYRLXXJyR7ol0YudSZ04XeHc5jnU7Q49a3EVda_qbgu4E4xw36DWrVqfsVO8cr91zDerkFMgscIVwWJogc/s1600/delete4.png' title='Hapus komentar jelek ini'/>
</a>
      <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'>
      <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/AVvXsEj7rxyc0FBNb9i5m6FqZigKO_CyksZwH8kZmb37MK6GH3zfhNWHcMNM1SOloN-8BNmsUiRrwdKRBfru3I0uP3CynOYNMzodTVnbkYjr1JX7ayfpyOy36ZLpvI1YdyLAqoTs-3AVjFAU_FU/s1600/smile1.gif',
        ':('  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiIuzpA8fVhiHNGqZ4Ph_uymHKlOXFA3PQpJ5tvZ2_PTRoe9S-YtLz8khR2HeIWp67CH__IMM2iW-dG9FDVdY480lBtlvVFKf9T6O4anoi1II2_zsL-DPx07LGyuQPQYkSIJHCxKyPGXiI/s1600/sad.gif',
        '=('  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiFsLBmHyejjG2diIvs7rbs9fjQnDOpInci1bDU2G5xWpvrL7XaA47XWvESdJILd-SkJ8ewvEVBiPR7xMeh1tkuhsQ3jtKxEEbDMWsHRE2A_kcGkS39cSNstvDkbMklnEEdWDWNdrcikv0/s1600/sadanimated.gif',
        '^_^'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgiaBnCLJGt288ULf0tME1yfcSCR9y73wY2laI8B_yowHt31zYyXGwZHiOBaF9Y_SDy6jt_hSSnaxrYj9U3I5KGiOlyl1uDPJKfdflv4-NbauRotGYrH5kbT64_kIjn-W_DQGXwc6UKUu0/s1600/smile.gif',
        ':D'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgqSAVT-EW2plpBgNrC7geqF2afbBsENHxBmQejDSIO1n56hyDV6InR3cftRrKESRHYpZBAPlc8lucBTLsKqmxFAFde5OJPOlZvLPBgyZdvs5WU45vYxuVbWKG7RyKer9Z3ARROpKpgObA/s1600/icon_smile.gif',
        '=D'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinzC-q5nDhKNyqhGsswYqqTOREIlFyZLmpWx73bxb-22RYEqmNOBB6dfrl2IMLwoPpiC0CQWICUfZ8QTi6GQ0VlYNP7ubKhWE352CRCcN_ZispxOiGlA4vvJLnAQnJzqeI2JyVZ00g_ZU/s1600/hihi.gif',
        '|o|'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEheOtbfnmDXDc1Kcxpkadyv0pI_YK-MaB_AZVpCoFVwf7lZpeODJ71K9W6fGf4PJb33LMaQfGOdzSnTFXVYTmMeCUBgz51F_gLUTiNqCTWCyZbuh9pfjAa9cF0wugfLUFNLdeGhdSyo1mU/s1600/applause.gif',
        '@@,'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjf7H9iAzEA1BTzdi_1cqFa-IfVzDK4h6aDefcG5TVDf2utFIQw7WSnamqubWoZqHn4MJHRiQv0qhb0te2gOH9pnCBRyg974sxwEPTsbnDm988PpfpIca5hZccGZtAcMDHyrFdDtdj3cfU/s1600/rolleyes.gif',
        ';)'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBasOClm9VbdfTclmdG6ozBHHiNZ2i_M7_FBNZXVAF006uRaMNtBssHRKkNM5UaGCPB91uHDdCqWwHCXAz8MdRcZMhIJethx3QbIOTie1PrJ471uJsfSMUrlmdc8hA3HD5FKJp3lpxDFs/s1600/wink.gif',
        'smiled'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgDeWgw-Y2d60CboVnYidRGz57OHCzlHiaFzl3miAzk2G65TPvBpEipNoI7innSX_ii2vb-Lvz8m9t4PspPMSR2XUPDzkUGnUaF47ACZnn28FUNlHqylGOWELGdJ85R-Ad4drtqbmpNGS0/s1600/thumb.gif',
        ':-d'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhD8i0RnZhg8w2x1-JbH1j5Fc-tptvIsVokDSWZzmi8e65epMZ6-WggycBq0fw__zV_H8BAKb5YdUracHyCvdwYAhfIf0BPrSqTAGRLKQtz-137Cp56owzAHf9ZAkgCMdlWWuU3XEoG9-o/s1600/thumbsup.gif', 
                                                                 ':p'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi2VBzcCqEtptgtavAC2H2UgO6ZFZUcu4VT1jjoX5OkCGxPlZAnZ28MBhSjVuI7ikWvdGiox0e0U1nbUIcZqaoRNlo7VuLafe9s9aHe0NJeBJSShkTGgV5BSB_vRErK6KbMyVOKiMtHPTo/s1600/wee.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>
</b:includable>

  • Sekarang klik simpan template dan lihat hasilnya, itulah tutorial cara membuat koment di blog sobat lebih bergaya dengan comment hack, jika ada keluhan dalam tutorial ini , silahkan ajukan di kolom komentar. lebih dan kurangnya saya mohon maaf.
1 Komentar untuk "Cara Membuat Threaded Coment Hack Style Valid HTML5"

manteb ne postnya, thanks...
udah kucoba n work bree....

Terimakasih sudah berkunjung di blog ZeroX
Di harapkan berkomentarlah yang Sopan,Bijak, dan Sesuai Artikel
Dilarang berkomentar berbau Porno, Spam, Sara, Politic, Provokasi.
Mohon maaf, untuk Link Aktif, akan terhapus secara otomatis
Terimakasih Atas komentar dan masukan sobat melalui kolom komentar

Baca Juga Artikel Ini close button minimize button maximize button