Thread comment có thể phân nhiều cấp tùy ý muốn sẽ giúp cho blog của bạn trở nên hấp dẫn hơn. Bài viết này namkna sẽ giới thiệu cho các bạn thêm một style mới được tùy biến giúp mẫu commnet của bạn cố thể phân nhiều cấp. Về cơ bạn style này giống với style 2 mà mình đã giới thiệu trước đây. Các bạn có thể xem ảnh minh họa bên dưới (đẹp phải không)

Hãy truy cập link sau để test thử nha:

Bấm để xem Demo

☼ Những gì mới trong tiện ích Thread comment ves 3 này:

Phiên bản này được namkna tùy biến thêm một số chức năng từ code cũ của kangismet. Một số chức năng mới bao gồm:
» Thêm phần viền và nền cho phần nội quy của khung comment.
» Sủ dụng bộ Ecomotion mới.
» Sử dụng file Jquery do vậy load mượt hơn (Bạn sẽ không cảm thấy chậm).
» Thêm scrip chèn ảnh, video, nhạc mà không cần sử dụng cá thẻ [img] hay [youtobe] hoặc [nct] mà chỉ cần dán trực tiếp link ảnh, link video từ youtube, link nhạc từ nhacucatui.
» Thêm scipt tạo khung cho code bạn chỉ càn dán đoạn code muốn đóng khung vào thẻ [pre]ư và [/pre]
» Giao diện đẹp, thích hợp với mọi blog tiếng việt và tiếng anh.
»Tích hợp phân trang cho bài viết có trên 200 comment.

☼ Cách Chèn Thread comment nhiều cấp vào Blogspot Ver 3:

1- Đăng nhập vào Blog
2- Vào Mẫu (Template) => CHỉnh sửa HTML => Mở rộng tiện ích mẫu
3. Tìm đoạn code:
<b:include data='post' name='threaded_comments'/>
- Thay thế bằng đoạn code sau:
<b:include data='post' name='comments'/>
4. Thay thế toàn bộ đoạn code ở giữa <b:includable id='comments' var='post'></b:includable> thành
<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'>
               <data:comment.authorAvatarImage/>
              </div>
              <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>   
              </div>  
         
              <div class='comment_service'>
               <span class='comment_date'><abbr class='published' expr:title='data:post.timestampISO8601'><data:comment.timestamp/></abbr></span>
               <b:include data='comment' name='commentDeleteIcon'/> 
              </div>
              <div class='clear'/>
             </div> 
             <div class='comment_body'>
<span class='cm_arrow'></span>
              <b:if cond='data:comment.isDeleted'>
               <span class='deleted-comment'><data:comment.body/></span>
              <b:else/>
               <p><data:comment.body/></p>
              </b:if><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)'>Reply</a>                                                        
             </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 = 5;//Kedalaman threaded comment
        Display_Emo = true;//Tampilkan emoticon? ganti "false" apabila tidak ditampilkan
        Replace_Youtube_Link = true;//Menampilkan link Youtube, ganti"false" untuk me-nonaktifkan
        Replace_Image_Link = true;//Menampilkan gambar, ganti  "false" untuk me-nonaktifkan.
                                Replace_Force_Tag = true;//Mengganti tag otomatis, seperti: [pre] menjadi <pre>, dan [/pre] </pre>, apabila salah mengetik, maka tidak akan tampil
        Replace_Image_Ext = ['JPG', 'GIF', 'PNG', 'BMP'];//(support: jpg, gif, png, bmp),hanya bekerja apabila Replace_Image_Link=true
        
        //List Emoticon
        Emo_List = [
        ':))'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9us-yhiDc6JKdYJkuVjsOJKSHs6trqdQWzfehEE7McwG5fOtCy3aauBX7bUCoUOPL_b_Lx_QWQRsqyQDcrLvaxsJJ2zJRt2MPGqaCjO8rc_poWG3gCvBoBHCDQJ9Yj-i9RSfVPNKKSEY/',
        ':(('  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj8Td6FSxKTglmvTJwOcvDJM7L0fvDDIYR5DhRn0B-6KjkJDzcloaZBhfofK1UOKzQ_u6qMMKhYJujO2n-NiNYHxqJ4qPgCZVyTDMlsP3-DChwVUt4teDneSFFntGzSPgbJyzpOXWsxM7M/',
        '=D'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjZyS0C85CMR7GzItgQyKABrKeyi2VoCQktUC6aX1cJcJFC3Q92H7AMeX9pkyDngi2Z25hUhgFpItDsme9mDxQe113w1z3-e5-I1NH8cGeiBzCk4qFAVoBRVqsU32yTVQ5xS09A79hypMM/',
        ':('  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiClq2mZyskj7Yk7p1EukHXBAMC2D4j6YF0z8yk7Z0UjHXPf4tfbiaq9xMgZDoX-ZRCpot5JcY6psvvVz3mR_2Iwx0G9S-jpFhvZIBbZlhYe2d8sqPjr8aTTnPLxvuZwieUBsQzH7WZBsk/',
        ':).'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjYmMUGcmOn3aNDu6bueSywfdCgcCkbZZY-PavxBxXuwK8-KhzCct5VcClJoSzi0lmOfpz99H1ngrIBeEDceXwotKjfoEUUhvciBuovZvcA-72_XJKWaWBFLrJ3SO7JApewj-bXctb0NNU/',
        'b-('  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjOCqsL9jjUTvSJgF1ErmY5HdPUgEParZRffI5EuHJECNhzzrbbIRfZLxYrP8_Kc8Oz3ZsrbGQ7cXXZJRVrjt_gUGdnZtewtsctQaQL4qnjOkSFojY88GgEr4r6g2eKGEu0qSL1hF2Cm-c/',
        ':)'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPrN2ZeiOkWhN6bxHYCrXS8mmww5x8EsNlLfcxUn_W6BYyj6GxlQc_Yvui6A8B6bMdr5GPUg9DlTRxvY5yOWX70sJc4mm5SfL2o0D3t8a55QkHKykFOyvuwVgTr0msJgiK1GqVwrmksWw/',
        ':P'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgh-6d1SP60WJcbUNZj_Qy6xjf4KFOAID28LnMXlKSdHcNd2TP3JhdGiIbkTa1M0Xqol3S6-KiMK5agJycU7Y2nhliKvZ-kC19JdHgatoJWCpjOxhTcwTHci54KDx5k5F079SNbwtrnULo/',
        ':-o'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiT8ntJ1mC_J70j-OUyNOqqY4KN85pqQ-d9_uu9Y4I-FMFtF8lAQybq5GnEtBT08ui8UthaLDuwd1CowciAls3wCs91pX21yBaTsRjyTmoVBJ3Wj2L5NsX-RijY8aQLJ40FcqBmVY3jSFU/',
        ':*'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhCjNtAg_cx9Eud238wIAHgCWYSOVkRPpQPVe8oPVwcKXwmAwoRrD0TE8oStGUGjXLJ6A31M-6AIOkN4Ygb8IGgrl7_5ZK8nBuM_sMiwDbDqxPdpo9x6XvZvHySPtl83B_jICgU8YaZUE/',
        ':-s'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiiCO1Rd0fY4MjMMA4LtDuf8wmSjyTxnSi0NpWvmtIBJXTb7f-IR8_hSW0gAV_ZoXvkJ61NUHDGnxM8_tv8wBLp1LLM6JIyi1t_70vsPYrenooxc35EqO9nyf0dgKu1N853XeecQ7DqRZ8/',
        '[-('  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMnGInhPwyz1ZJhdlSd8Ek6ORvQJyOfvvZ0X3MYiI2BjOcoTfjeocU3dx7Evc3YMUGn2IshbhI_GHNOlAtzpH0gqfAXnNAD3eMdMxOtyyX0GcB12ELIw5DgCABPdxxGY5adCmNuwsODEI/',
        '@-)'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi8o8nOdOYgnZhrelpQt33Ujr823tjoNzMI4sMj3izYY1xvEKBFt08Pngj9QtPysyT6mOLuYK9DZ5j25FNR4Xi0KKkAAQ3eaLUnt2PPOBSpm8EYtdBAtxuJsKZZjbWegdQX2agXcibK18w/',
        '=d&gt;'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhrw1no5mqZXWweUrtL5bnTOX7mE4B6XWjqLBhgmDbQtFYUTLjv58rteRbFZFLvIKYuiBK6fMGpil7Q0THlAXPV-b_TqaxggmNibvNc1uW0rXXrCE-goqds11Wh5TUhM0mz3Ek5k2yNHH0/',
        'b-)'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgtokg0Jm2H1zUzG0sOAUXK2kyVhgS5bhd8sZAmz9Uo7eFhdpDzTDs2yciXqCqlHFFlauqrA-vxmjY4CPJNgdAP5fD7waH-NJz9xDfTfEhp7zBSPJ3N6_C96N8gqcGK-gVcncm4IJshZck/',
        ':-?'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiNagg-qK14MZfwodTRkhrs9OU2RYEKocM5yzhxop_8DjZz3SWPGgHetdiMIEtFo7w2p8gHcjsLjAe1ubt0a_lZUHOt0Z9OTo4rTkqvcK5yoZpfA0DEZE2YeaA1WwTPiEXkR2eLRwzUwuI/',
        ':-&gt;'  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgUG-geOqCqtLkm56Hnvlg34bEXcM2e9gIF5qiiBWrIoIzrCjN4M9RNo8gKKeWIoyd0zth3tCVNRm0mK9DrNeQnz2iGT45uxf72p_XCvOW6IDZ8WJpdSrNxT1IXhy3VWPoT-99Pvib5Xpc/',
        'X-('  ,'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg8nClW42wI_9NXWAXZVgiCJuD0aRsg4cXYvoM9WchgAZedGcAt1Or7xnMFFLdy8K0QzeWZLyr_n_PBaCuOzqr6sJztn79qrumG-FNaLJWW1sm2M8x5u1aLJXsr_HpACgga49GRBr9her4/'
        ];
        
                                
                                //Mengganti tag, gunakan huruf kecil
                                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>
» Tùy chỉnh:
  • Config.maxThreadDepth = 5; là số cấp comment sẽ hiển thị. mặc định mình để lad 5. bạn có thể thay thành số khác. Tuy nhiên không nên phân quá nhiều cấp nếu độ rộng blog của bạn khiêm tốn.
  • Display_Emo = true; Cài đặt hiện thị mặt cười emoticons. Nếu không muốn hiển thị hãy thay true thành false.
  • Replace_Youtube_Link = true; Cài đặt tự động chuyển link video từ trang youtobe thành trình phát video trên comment. Nếu không muốn hiển thị hãy thay true thành false.
  • Replace_Image_Link = true;Cài đặt tự động chuyển link hình ảnh từ thành hình ảnh trên comment. Nếu không muốn hiển thị hãy thay true thành false.
  • Replace_Force_Tag = true;Cài đặt đóng khung cho code trên comment. Nếu không muốn hiển thị hãy thay true thành false.
5. Thêm đoạn code bên dưới vào trên thẻ ]]></b:skin> :
#comments{background:#f2f2f2;float:left;width:100%;padding:20px 10px 0;font-size:13px;margin-top:-10px}
.comment-form p {background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjbgDHPFdA-KhhlDpsx6F-UNvHh1_s6LPwqlz9Rj7wmzjpW20yhfAVTISOREsabJsYxhq5b2eGx_lGjxJFsO9BYC0cdbCXzsI1f1vh2KBapbI-MkMtrDSmv92vM42-yILNd0Vq_2I8aXemG/s1600/warning_namkna-blogspot-com.png);background-position: 12px 27px;background-repeat: no-repeat;background-color: #FFF799;border: #EE9D00 solid thin;padding: 1em;padding-left: 70px;color: #000;margin:30px 12px 20px 0}
#respond{margin-top:30px}
.emoticons a,.emoticons a:hover{margin-left:20px;font-size:28px;text-decoration:none}
.cm_arrow {background:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjHzaMIqobtxDFHcAI1lzizsq2PLl2yMLj4hyphenhyphenSEj-L-n3w3DTRNIWZ3nG_Ac5y4y-Mo4ol1vl5ikV5eKA8hJHjjoDwY_k85j5eYlReTKM2mcjevGI-K27Eus6dR2Z1yG9t2yDEIPi3X16Cx/s1600/comment-arrow_namkna.blogspot-com.gif') no-repeat;display:block;height:23px;margin-left:-25px;margin-top:0px;position:absolute;width:12px}
.comment_admin .comment_body {background: #fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi0P_REyg21dkQ6mf0nEPCabCyPhKfzE6UoIZxEoO93IlOI70VXtfVLsdC3ssVvm5SM-LvfWrEhSuxtesvvJixwIimdljgs1luvyzBbpM_dLi6rnHvTyRWuVh05EJPbXLJ8W-TKKXRvg2yH/s1600/admin-icon_namkna-blogspot-com.png) top right no-repeat}
#comments h4 {font-size: 20px;color: #666;text-shadow: 0 0 1px #CCC;display: block;width: 100%;border-bottom: 1px dotted #CCC;padding: 20px 0 5px 0;margin: 0;}
.unneeded-paging-control {display: none;}
.comment_child .comment_wrap {padding: 0 0 0 20px;}
.comment_header {background:#f5f5f5;border:1px solid #ccc;box-shadow: 0 0px 10px #ccc;float: left;padding:5px 5px 5px 5px;
width: 115px;margin: 10px 15px 0 0;}
.comment_avatar img {margin: 0 15px 0 0;border-width: 1px;-moz-border-radius: 2px;-webkit-border-radius: 2px;border-radius: 2px;-webkit-background-clip: padding-box;}
.comment_body {margin: 10px 0px 0px 150px;line-height: 1.6;font-size: 13px;padding: 15px;background:#fff;position:relative;
text-decoration:none;color:#996633;border:1px solid #dadada;-webkit-border-radius:0 0.25em 0.25em 0;-moz-border-radius:0 0.25em 0.25em 0;border-radius:0 0.25em 0.25em 0;}
.comment_name {margin: 0 0 0 40px!important;font-family: Arial, Helvetica, Garuda, sans-serif; line-height: 1;
margin: 2.1em 0 1em;color: #525252;font-weight: bold; font-size: 15px}
.comment_name a {color: #525252;text-decoration: none;text-shadow: 0 0 1px #DDD;font-size: 12px;}
.comment_name a:hover {color: #F90;}
.comment_service {margin: 0 0 0 41px;color: #CCC;font-size: 10px;font-style: italic;}
.comment_body p {margin: 0;line-height: 1.6;font-size: 12px;padding: 0;text-decoration:none;color:#996633}
.comment_avatar .avatar-image-container {height: 36px!important;width: 36px!important;background:#e3e3e3; border: 1px solid #e3e3e3; -moz-border-radius: 2px;-webkit-border-radius: 2px;border-radius: 2px;-webkit-background-clip: padding-box;}
.comment-form {max-width: 100%;!important;}
#comment-editor {width:101%!important}
.comment_admin {}
.comment_form a {text-decoration: none;text-transform: uppercase;font-weight: bold;font-family: Arial, Helvetica, Garuda, sans-serif;font-size: 15px;color: #24458A;}
.comment_form a:hover {text-decoration: none;}
.comment_reply_form {padding: 0 0 0 20px;border-left: 1px solid #DDD;}
.comment_reply_form .comment-form {width: 99%;}
.comment_emo {max-width: 2.7em;max-height: 2.7em;vertical-align: middle;margin: -0.3em 0 0 0;}
.comment_emo_list .item {float: left;width: 8%;text-align: center;height: 8%;margin: 10px 3% 4% 0;}
.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;}
.comments .avatar-image-container img {width:36px!important;height:36px!important}
.deleted-comment {text-decoration: line-through;font-style: italic;color: #999;}
#respond {overflow: hidden;padding-left: 10px;margin-top: 30px;clear: both;}
.comment_inner {margin: 0 0 5px 0;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHNWMW1VYeH_fC2t8R1gza8QZKTD1eW5K7Rak-aS5LspDTYkb5KxdFeRtSi4Sgqmujd82C-X75KH-5ohRnS1eVFFGD6QD2dtWW7kced8W0PRknIb7v7uJBxuiYdGPGX66BtUDy5YToq55k/s1600/f-boxAbout-bg_namkna-blogspot-com.png) repeat-x top;padding: 5px 0 5px;}
.comment_reply {clear: both;height: 40px;filter: alpha(opacity=60);opacity: 0.6;background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgGZ69fhejLDR8DUkXNuUomytqIjq5okLlMUcZ1jdGcW9bFp6gZgHRG0utaLx_XBAdGOO7xm1Fbbf1WMA01rC4bpa0zB9HBXaQyN4OuW4FVaXMgbb1RvR8GsDoPxft3gnC6p9k-e5w7Z02w/s1600/reply_namkna-blogspot-com.png) no-repeat top left;padding-left: 16px;margin-top:20px;font-weight: normal;text-transform: uppercase;font-family: Arial, Helvetica, Garuda, sans-serif;font-size: 10px;color: #666;}
.comment_inner:hover &gt; .comment_reply {filter: alpha(opacity=100);opacity: 1;}
.comment_child .comment_wrap {background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4-PMSiS4-Dx_zXQoEYGl67Nngjo5puYlmKjv7bnoRyz6rwdx1w2XSpwA2VuXzbM6mgqKqkAlpasNVzHcs8h1W0zw4EYcYRfBzs2dkfKMm6c1RNUDrabdHMpG1D1KBvXbQr0PBBYhsXajV/s1600/reply_bg_namkna-blogspot-com.png) no-repeat;padding: 0px 0 0 36px;}
Chúc thành công!