Skip to main content

Cara Membuat Komentar Blogspot Sama Seperti WordPress (Thread Reply Comment)

Cara membuat thread reply comment pada blogspot - Setelah muter - muter mbah google mencari trik ini, akhirnya ketemu juga. Waktu pertama ketemu trik yang seperti ini di google, saya senang sekali. Hanya saja trik yang pertama kali saya temukan memiliki sedikit kekurangan, jika menjawab komentar orang lain komentar kita berada dipaling bawah, bukan dibawah komentar yang ingin kita jawab.

Sebenarnya trik komentar seperti ini adalah komentar dari platform WordPress. Dan menurut saya keren kalau bisa dipraktekkan di blog saya, platform blogspot. Jadi saya berusaha untuk mencari trik ini untuk blog saya. Saya sering memasukkan keyword " cara membuat threaded reply comment di blogspot ", tapi posting yang muncul itu triknya memiliki kekurangan seperti diatas. Jadi saya putuskan untuk posting di blog saya, karena menurut saya posting seperti ini Insya Allah banyak dikunjungi ... Amien ... Yuk langsung saja sob ...
  • Dasbor > Rancangan / Layout
  • Ke Edit HTML
  • Copy kode dibawah ini


<script type="text/javascript">  //<![CDATA[/*  --- Threaded Comments ---v 0.9.3 15th March 2009By Rijal Islamihttp://caratrikblog.blogspot.com */function Author(C,A,B){this.id=C;this.name=A;this.url=B;this.toString=function(F){var E="\t";if(F){for(var D=0;D<F;D++){E+="\t"}}return"Author[\n"+E+"id="+this.id+", \n"+E+"name="+this.name+", \n"+E+"url="+this.url+"\n"+E+"]"}}function Comment(E,H,G,C,B,D,F,A){this.id=E;this.sequenceNumber=H;this.postedTime=G;this.body=F;this.deleted=A;this.deleteUrl=B;this.deleteText=D;this.parentId="";this.children=new Array();this.level=0;this.author=C;this.getChildCount=function(){return this.children.length};this.addChild=function(I){this.children[this.getChildCount()]=I.id;I.parentId=this.id;I.level=this.level+1};this.toString=function(K){var J="\t";if(K){for(var I=0;I<K;I++){J+="\t"}}return"Comment[\n"+J+"id="+this.id+", \n"+J+"sequence="+this.sequenceNumber+", \n"+J+"deleted="+this.deleted+", \n"+J+"parentId="+this.parentId+", \n"+J+"children=["+this.children+"], \n"+J+"level="+this.level+", \n"+J+"author="+this.author.toString(1)+", \n"+J+"posted time="+this.postedTime+", \n"+J+"body="+this.body+"\n"+J+"]"}}function trimBrsFromString(C){var F=trimString(C);var B=["<br>","<br >","<br/>","<br />","<BR>","<BR >","<BR/>","<BR />"];if(F){var E=true;while(E){E=false;for(var D in B){var A=B[D];if(F.indexOf(A)==0){F=F.substring(A.length);F=trimString(F);E=true}var H=F.length;var G=F.lastIndexOf(A);if(G>=0&&G==H-A.length){F=F.substring(0,G);F=trimString(F);E=true}}}}return F}function trimString(A){var E="";if(A){var D=false;for(var B=0;B<A.length;B++){var F=A.charAt(B);if(!D&&F!=" "&&F!="\n"&&F!="\t"){D=true}if(D){E+=F}}D=false;var C=-1;for(var B=E.length-1;!D&&B>0;B--){var F=E.charAt(B);if(!D&&F!=" "&&F!="\n"&&F!="\t"){D=true;C=B}}if(C>0){E=E.substring(0,C+1)}}return E}function addItem(A,B){A[B.id]=B}function getAllItems(C){var D=new Array();var B=0;for(var A in C){D[B]=C[A];B++}return D}function getItemsCount(C){var B=0;for(var A in C){B++}return B}var ALL_AUTHORS=new Object();var ALL_COMMENTS=new Object();function getNewAuthorId(){var C=1;for(var A in ALL_AUTHORS){if(ALL_AUTHORS[A]&&ALL_AUTHORS[A].id){var B=ALL_AUTHORS[A].id;if(B>=C){C=B+1}}}return C}function createAuthor(C,A,B){return new Author(C,A,B)}function addAuthor(A){addItem(ALL_AUTHORS,A)}function getAllAuthors(){return getAllItems(ALL_AUTHORS)}function getAuthorsCount(){return getItemsCount(ALL_AUTHORS)}function findAuthor(C,B){for(var A in ALL_AUTHORS){if(ALL_AUTHORS[A]){if(ALL_AUTHORS[A].name==C&&ALL_AUTHORS[A].url==B){return ALL_AUTHORS[A]}}}return null}function getNewCommentSequence(){var C=1;for(var A in ALL_COMMENTS){if(ALL_COMMENTS[A]&&ALL_COMMENTS[A].sequenceNumber){var B=ALL_COMMENTS[A].sequenceNumber;if(B>=C){C=B+1}}}return C}function createComment(E,H,G,C,B,D,F,A){return new Comment(E,H,G,C,B,D,F,A)}function addComment(A){addItem(ALL_COMMENTS,A)}function getAllComments(){return getAllItems(ALL_COMMENTS)}function getRootComments(){var D=new Array();var C=0;for(var A in ALL_COMMENTS){var B=ALL_COMMENTS[A];if(B&&B.level==0){D[C]=B;C++}}return D}function getCommentsCount(){return getItemsCount(ALL_COMMENTS)}function findComment(B){for(var A in ALL_COMMENTS){if(ALL_COMMENTS[A]){if(ALL_COMMENTS[A].id==B){return ALL_COMMENTS[A]}}}return null}function findLastCommentByAuthorName(C){var B=null;for(var A in ALL_COMMENTS){if(ALL_COMMENTS[A]){if(ALL_COMMENTS[A].author.name==C){B=ALL_COMMENTS[A]}}}return B}function findLastCommentByPartialAuthorName(C){var B=null;for(var A in ALL_COMMENTS){if(ALL_COMMENTS[A]){if(ALL_COMMENTS[A].author.name.toLowerCase().indexOf(C.toLowerCase())==0){B=ALL_COMMENTS[A]}}}return B}function addCommentHierarchy(D,C){if(D){C[C.length]=D;var A=D.children;for(var B in A){addCommentHierarchy(findComment(A[B]),C)}}}function getCommmentsInSortedOrder(){var D=new Array();var A=getRootComments();for(var B in A){var C=A[B];addCommentHierarchy(C,D)}return D}function ParsedResult(A,B){this.parentComment=A;this.body=B;this.toString=function(){return"[parentComment="+this.parentComment+", body="+this.body+", ]"}}function findParentCommentFromDescriptor(A){var B=findComment(A);if(B==null){B=findLastCommentByAuthorName(A)}if(B==null){B=findLastCommentByPartialAuthorName(A)}return B}function parseCommentBody(B,F){B=trimString(B);var A=B.indexOf("@");if(A==0){var H=B.indexOf("\n",0);var G=B.indexOf("<",0);var D=H;if(G>0&&(G<D||D<0)){D=G}if(D>2){var O=B.substring(1,D);O=trimString(O);var K=findParentCommentFromDescriptor(O);if(K==null){var J=O.indexOf(" ");if(J>0){var N=trimString(O.substring(0,J));K=findParentCommentFromDescriptor(N);if(K!=null){D=J+1}}}if(K!=null){var P=null;var Q=D;var C=B.indexOf("@",Q+1);if(C>Q){var M=trimString(B.substring(C));P=parseCommentBody(M,C)}if(P&&P.length>0&&P[0].parentComment!=null){var L=trimString(B.substring(D,C));var I=new ParsedResult(K,L);var E=[I].concat(P);return E}else{var L=trimString(B.substring(D));var I=new ParsedResult(K,L);return[I]}return E}}}var I=new ParsedResult(null,B);return[I]}function buildComment(C,K,H,L,G,I,M,A){var F=findAuthor(C,K);if(!F){F=createAuthor(getNewAuthorId(),C,K);addAuthor(F)}var D=parseCommentBody(A,0);for(var J in D){var E="";E=D[J].body;E=trimBrsFromString(E);var B=createComment(H+"."+J,getNewCommentSequence(),L,F,I,M,E,G);addComment(B);if(D[J].parentComment!=null){D[J].parentComment.addChild(B)}}}function substituteConstant(A,D,C){var B=A;while(B.indexOf(D)>=0){B=B.replace(D,C)}return B}function substituteConstantIfValueExists(D,A,I,C,H){var J=D;var F=J.indexOf(A);var E=J.indexOf(I);while(F>0&&E>F){var B=J.substring(F,E+I.length);var G=null;if(H&&H.length>0){G=substituteConstant(B,C,H);G=G.substring(A.length,G.length-I.length)}else{G=""}J=J.replace(B,G);F=J.indexOf(A);E=J.indexOf(I)}return J}function isBlogAuthor(B){var A=false;if(window.BLOG_AUTHORS){for(var C in BLOG_AUTHORS){if(BLOG_AUTHORS[C]==B){A=true;break}}}else{if(window.BLOG_AUTHOR){A=(BLOG_AUTHOR==B)}}return A}function applyCommentTemplateToComment(F,E){var A=F;A=substituteConstant(A,"${COMMENT.ID}",E.id);A=substituteConstant(A,"${COMMENT.TIMESTAMP}",E.postedTime);A=substituteConstant(A,"${COMMENT.AUTHOR.NAME}",E.author.name);var C=(E.level>3)?"gt3":E.level;A=substituteConstant(A,"${COMMENT.LEVEL}",C);A=substituteConstantIfValueExists(A,"${COMMENT.AUTHOR.URL.EXISTS.START}","${COMMENT.AUTHOR.URL.EXISTS.END}","${COMMENT.AUTHOR.URL}",E.author.url);A=substituteConstant(A,"${COMMENT.AUTHOR.URL}",E.author.url);A=substituteConstant(A,"${COMMENT.DELETE.URL}",E.deleteUrl);A=substituteConstant(A,"${COMMENT.DELETE.TEXT}",E.deleteText);A=substituteConstant(A,"${COMMENT.BODY}",E.body);var D=isBlogAuthor(E.author.url)?"blog-author-comment":"blog-nonauthor-comment";A=substituteConstant(A,"${BLOG.AUTHOR}",D);A=substituteConstant(A,"${BLOG.POST.COMMENT.LINK}",BLOG_POST_COMMENT_LINK);var B=(E.deleted)?"deleted-comment":"";A=substituteConstant(A,"${COMMENT.DELETED.STYLE}",B);document.writeln(A)}function applyCommentTemplate(C){var D=getCommmentsInSortedOrder();for(var A in D){var B=D[A];applyCommentTemplateToComment(C,B)}}function setElementDisplay(B,C){var A=document.getElementById(B);if(A){A.style.display=C}}function setElementsDisplay(B,C){for(var A in B){setElementDisplay(B[A],C)}}function showElements(A){setElementsDisplay(A,"block")}function hideElements(A){setElementsDisplay(A,"none")}function showElement(A){setElementDisplay(A,"block")}function hideElement(A){setElementDisplay(A,"none")}function toggleElementDisplays(C,B,D){if(C.innerHTML=="[Sembunyikan]"){for(var A in B){if(D[A]=="both"||D[A]=="hide"){hideElement(B[A])}}C.innerHTML="[Tampilkan]"}else{for(var A in B){if(D[A]=="both"||D[A]=="show"){showElement(B[A])}}C.innerHTML="[Sembunyikan]"}};// ]]></script>

  • Paste kode diatas tepat sebelum (diatas) kode <b:skin>
  • Kemudian copy kode dibawah ini lagi


    .comment-segment {padding:5px;margin-top: 10px;margin-right: 10px;}.comment-level-0 {padding:5px;margin-left: 10px;}.comment-level-1 {padding:5px;margin-left: 25px;}.comment-level-2 {padding:5px;margin-left: 40px;}.comment-level-3 {padding:5px;margin-left: 55px;}.comment-level-gt3 {padding:5px;margin-left: 70px;}.blog-author-comment {padding:5px;background-color: #FFFFFF;border: 1px solid #FFFF99;}.blog-nonauthor-comment {padding:5px;background-color: #FFFFFF;border: 1px solid #7296E2;}.deleted-comment {color: gray; font-STYLE: italic}.delete-comment-icon {background: url("http://www.blogblog.com/rounders3/icon_delete13.gif")no-repeat;}.comment-time {font-size: 80%;margin: inherit;padding-left: 10px;padding-bottom: 10px;}.reply-guide {background-color: #FFFFFF;border: #076a93 1px dotted;display: none;padding-right: 10px;padding-left: 10px;padding-bottom: 0.75em;padding-top: 5px;margin-right: 10px;margin-bottom: 10px;}.reply-guide-header {color: #076a93;padding-top: 10px;}.reply-guide-list {list-style: none;padding-left: 2px;margin-left: 2px;}.reply-guide-example {font-size: 85%;margin-right: 5px;margin-bottom: 10px;float: right;border: 1px dotted #076a93;padding: 5 5 5 5;} 

    • Paste kode diatas tepat sebelum (diatas) ]]></b:skin>
    • Simpan Template !
      Istirahat dulu sob, barang kali sobat pusing ...
      Sudah cukup istirahatnya, kita lanjut yuk ...
      • Dasbor > Rancangan / Layout
      • Ke Edit HTML
      • Centang " Expand Template Widget "
      • Cari kode <b:includable id='comments' var='post'>
      • Ganti kode <b:includable id='comments' var='post'> sampai kode </b:include> diatas kode <div id='sidebar-wrapper'> dengan kode dibawah ini


          <b:includable id='comments' var='post'>  <div class='comments' id='comments'>    <a name='comments'/>    <b:if cond='data:post.allowComments'>      <h4>        <b:if cond='data:post.numComments == 1'> 1 <data:commentLabel/>:        <b:else/><data:post.numComments/><data:commentLabelPlural/>:         </b:if>      </h4>      <b:if cond='data:post.numComments > 0'>        <!-- Include a post comment link before rendering the comments -->        <p class='comment-footer'>        <b:if cond='data:post.embedCommentForm'>          <b:include data='post' name='comment-form'/>          <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>        </p>      </b:if>      <!-- Loop through the comments adding the comment bodies in a hidden div -->      <b:loop values='data:post.comments' var='comment'>        <div style="display: none;" expr:id='"comment-body-" + data:comment.id' >          <data:comment.body/>        </div>      </b:loop>      <!-- Now create the comment using our javascript -->      <script type="text/javascript">        // USE THIS if YOU Have multiple Authors adding them in a comma separated form after removing the '//' from the next line        // var BLOG_AUTHORS = ['http://www.blogger.com/profile/firstauthor', 'http://www.blogger.com/profile/secondauthor', 'http://www.blogger.com/profile/thirdauthor'];        // Use this if you have just one author like this blog :)        var BLOG_AUTHOR = 'http://www.blogger.com/profile/10301627897367423203';        var BLOG_POST_COMMENT_LINK = '<data:post.addCommentUrl/>';        var eCommentDelete = false;        var eAuthorUrl = '';        <b:loop values='data:post.comments' var='comment'>          eCommentDelete = false;          eAuthorUrl = '';          <b:if cond='data:comment.authorUrl'>            eAuthorUrl = "<data:comment.authorUrl/>";          </b:if>          <b:if cond='data:comment.isDeleted'>            eCommentDelete = true;          </b:if>                    buildComment("<data:comment.author/>", eAuthorUrl,             "<data:comment.id/>", "<data:comment.timestamp/>", eCommentDelete,             "<data:comment.deleteUrl/>", "<data:top.deleteCommentMsg/>",             document.getElementById('comment-body-<data:comment.id/>').innerHTML);        </b:loop>        // <![CDATA[        var eCommentTemplate = '' +           '<div class="comment-segment comment-level-${COMMENT.LEVEL} ${BLOG.AUTHOR} ${COMMENT.DELETED.STYLE}" >' + '\n' +           '  <a name="comment-${COMMENT.ID}"></a>' + '\n' +           '  <span style="float: right; margin-right: 5px; " >' + '\n' +           '  <a href="#" ' + '\n' +           '    onclick="toggleElementDisplays(this, ' +           '[\'comment-${COMMENT.ID}-body\', \'comment-${COMMENT.ID}-footer\', \'reply-guide-${COMMENT.ID}\'], ' +           '[\'both\', \'both\', \'hide\']); return false;" >[Sembunyikan]</a>' + '\n' +           '  </span>' + '\n' +           '  <span class="comment-author" >' +           '${COMMENT.AUTHOR.URL.EXISTS.START}' +           '<a   href="${COMMENT.AUTHOR.URL}" rel="nofollow">' +           '${COMMENT.AUTHOR.URL.EXISTS.END}' +           '${COMMENT.AUTHOR.NAME}' +           '${COMMENT.AUTHOR.URL.EXISTS.START}' +           '</a>' +           '${COMMENT.AUTHOR.URL.EXISTS.END}</span>' + '\n' +           '  said... ' + '\n' +           '  <div id="comment-${COMMENT.ID}-body" class="comment-body" ><p>${COMMENT.BODY}</p></div>' + '\n' +           '  <span class="comment-time">on ${COMMENT.TIMESTAMP}</span>' + '\n' +           '  <div id="reply-guide-${COMMENT.ID}" class="reply-guide comment-level-0 " >' + '\n' +           '     <span style="float: right;" ><a href="#" onclick="hideElement(\'reply-guide-${COMMENT.ID}\'); return false;" >[Sembunyikan]</a></span>' + '\n' +           '     <h4 class="reply-guide-header">How to Reply to this comment</h4>' + '\n' +           '     <span>' + '\n' +           '     To reply to this comment please ensure that <b>one</b> of the following lines: ' + '\n' +           '     <ul class="reply-guide-list">' + '\n' +           '<li>@${COMMENT.ID}</li>' + '\n' +           '<li>@${COMMENT.AUTHOR.NAME}</li>' + '\n' +           '     </ul>' + '\n' +           '     is the <b>first line</b> of your comment. ' + '\n' +           '     <br />' + '\n' +           '     <a href="${BLOG.POST.COMMENT.LINK}"' + '\n' +           '     >Click here to enter your reply</a>' + '\n' +           '     </span>' + '\n' +           '  </div>' + '\n' +           '  <div id="comment-${COMMENT.ID}-footer" class="comment-footer">' + '\n' +           '    <span><a ' +           'href="#" onclick="showElement(\'reply-guide-${COMMENT.ID}\'); return false;" >Reply</a></span> ' + '\n' +           '    <span><a href="#comment-${COMMENT.ID}">Permalink</a></span> ' + '\n' +           '    <span><a href="${COMMENT.DELETE.URL}" title="${COMMENT.DELETE.TEXT}" style="text-decoration: none;" ><span class="delete-comment-icon"> </span></a></span>' + '\n' +           '  </div>' + '\n' +           '</div>' + '\n';                 applyCommentTemplate(eCommentTemplate);        // ]]>      </script>      <p class='comment-footer'>        <a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>      </p>    </b:if>    <div id='backlinks-container'>      <div expr:id='data:widget.instanceId + "_backlinks-container"'>        <b:if cond='data:post.showBacklinks'>          <b:include data='post' name='backlinks'/>        </b:if>      </div>    </div>  </div></b:includable>





        • Simpan Template !







        • Mungkin ada sobat yang kurang paham akan trik pasang thread reply comment di blogspot, silahkan bisa bertanya (komentar). Soalnya saya pusing mau jelasin apalagi. Sekian dulu sob ^^ ...

          Selesai

          Comments

          1. @7883736019525116267.0
            Keduax Reply Comment

            ReplyDelete
          2. bagus nih kang tapi ada yang otomatis ga nih jadi rebet kalau gitu mah euy saya tunggu yang yang simple makasih atas infonya

            ReplyDelete
          3. @5839778792723339946.0
            @Raindra Kalau yang simple mah belum dapet. Tapi nanti saya usaha untuk mengedit tutorial ini sampai semudah mungkin untuk dimengerti ^^

            ReplyDelete
          4. @1626570047340051346.0
            Ketigax thread reply comment

            ReplyDelete
          5. @6059973114102519273.0
            Keempatx thread reply comment

            ReplyDelete
          6. @95254147042813110.0
            Kelimax thread reply comment

            ReplyDelete
          7. @8890199096112845627.0
            Ngerti nggak ?

            ReplyDelete
          8. terimakasih telah memberikan tutor yg simple, sekarang saya mau nanya lagi bagaimana membuat form komentar/guestbook untuk halaman web yg hostingnya berbayar

            ReplyDelete
          9. @142316781661323121.0
            Aduh, saya belum pernah tuh pake hosting berbayar ..
            Maaf gan saya belum bisa jawab ^.^

            ReplyDelete

          Post a Comment

          Berkomentar dengan menggunakan kalimat yang baik dan santun. Dimohon untuk tidak berkomentar SPAM, karena komentar akan dihapus!
          Tips:" Berlangganan Via Email " terlebih dahulu agar komentar cepat dibalas!

          Popular posts from this blog

          Cara Meningkatkan Links In pada Alexa

          Sebelumnya, ini adalah hasil copy paste. Entah cara seperti ini palsu atau nyata, tapi tidak ada salahnya mencoba. Oke, check this out .. Salam Blogger , pada kesempatan kali ini dan pada posting ini juga saya akan sedikit memberi sedikit trik untuk megoptimalkan semua static yang tertera di alexa. Jika sebelumnya saya membahas tentang cara meningkatkan links in alexa alhamdulillah di posting kali ini berkenaan dengan gimana caranya untuk meningkatkan atau menambah Link in pada alexa. alexa adalah salah satu situs yang memberikan pelayanan untuk trafik blog. Alexa dapat menghitung semua kegiatan lalu lintas blog anda, jadi dengan begitu sobat dapat mengetahui apakah blog anda sudah bagus trafiknya atau tidak. Alexa tidak hanya menghitung lalu lintas blog saja, tetapi alexa juga menyediakan widget untuk blog baik itu blogspot maupun wordpress dan alexa juga menyediakan toolbar untuk browser yang dipakai di komputer sobat. Dan ternyata banyak para blogger yang memil

          Dokumentasi Project Kontes Robot Indonesia dan Tugas Akhir

               Pada Kontes Robot Indonesia (KRI) 2017, tim dari Universitas Jenderal Soedirman lolos ke tahap nasional yang bertempat di Universitas Pendidikan Indonesia.      Robot Pemadam Api Berkaki yang dibangun pada tahap regional, dan yang meloloskan tim Universitas Jenderal Soedirman ke tahap nasional.      Tim Universitas Jenderal Soedirman divisi ABU usai berlomba. Pada tahap ini tim tidak berhasil lolos ke tahap nasional.       Melakukan pengkalibrasian sensor IMU (Inertial Measurement Unit). Sensor IMU merupakan gabungan dari 3 sensor lainnya, yaitu accelerometer , gyroscope , dan magnetometer. Pada penelitian yang saya lakukan hanya menggunakan sensor accelerometer yang ada di sensor IMU.       Pengujian sensor IMU dalam mengukur perubahan sudut pitch .       Pengujian sensor IMU dalam mengukur perubahan sudut roll .        Sensor IMU yang telah mendeteksi perubahan sudut, merupakan konversi dari nilai percepatan bumi yang dideteksi oleh ac

          Apa yang dimaksud dengan Cc dan Bcc?

          Apa yand dimaksud dengan Cc dan Bcc? - Assalamu'alaikum! Akhir-akhir ini, saya sering membahas tentang cara mengirim email di gmail maupun yahoo!. Bukannya saya vacum dari membahas blogging , tapi saya hanya berbagi ilmu yang saya ketahui pada ilmu emailing . Karena, pastilah ada sobat-sobat di luar sana yang kurang paham akan hal emailing . Dan semoga saja, dengan membaca post ini, sobat-sobat semua bisa menjadi paham. :) Tapi tunggu sebentar, pada saat ingin mengirim pesan offline ke email lain, apakah sobat pernah melihat kata Cc dan Bcc ? Apa maksud dari kata Cc dan Bcc ? Ingin tahu? Silakan baca sampai tuntas post ini. Cc adalah singkatan dari Carbon Copy . Maksud dari Cc adalah apabila kita mengisi email pada kolom Cc , maka email tersebut akan menerima pesan yang telah kita buat dengan pemberitahuan bahwa pesan yang ia dapatkan adalah hasil salinan dari pesan yang telah kita kirimkan kepada email lain. Contoh: saya@gmail.com mengirim pesan kepada anda@gmail.com.