Skip to main content

Mengatasi Error Kolom Komentar Loading Terus

Pernah mengalami error pada kolom komentar? Baik itu berupa keadaan terus-menerus loading, atau reply komentar yang tidak berjalan, atau error hanya terjadi di bagian laman statis, atau mungkin errror yang lain di kolom komentar.

Nah, kebetulan Tips SEO Terbaik juga pernah mengalami hal tersebut di beberapa blog yang lain. Error yang terjadi adalah loding yang terus menerus dan tombol reply yang tidak berfungsi.

Berikut ini adalah beberapa tips yang Saya dapatkan dari blog.kangismet.net, meskipun tips mengatasi error ini sudah cukup lama di posting, namun sampai saat ini masih cukup relevan untuk mengatasi masalah error di kolom komentar ini.
Error di kolom komentar

Jika error yang terjadi adalah loading yang tanpa henti pada kolom komentar, tentu saja ini juga sangat tidak bagus dari sisi SEO.
Baca Juga :
Cara Cepat Mendatangkan Trafik Blog
Cara Menghapus Link di kolom komentar

Baiklah, Silakan langsung disimak panduan mengatasi error di kolom komentar berikut ini beserta tahapan-tahapannya:

1. Masuk ke dashboard blogspot anda.
2. Masuk ke tab Template >> edit HTML
3. Kemudian cari kode seperti ini :
<b:includable id='threaded_comment_js' var='post'>
  <script defer='defer' expr:src='data:post.commentSrc' type='text/javascript'/>

  <script type='text/javascript'>
    (function() {
      var items = <data:post.commentJso/>;
      var msgs = <data:post.commentMsgs/>;
      var postId = &#39;<data:post.id/>&#39;;
      var feed = &#39;<data:post.commentFeed/>&#39;;
      var authorName = &#39;<data:post.author/>&#39;;
      var authorUrl = &#39;<data:post.authorUrl/>&#39;;
      var blogId = &#39;<data:top.id/>&#39;;
      var baseUri = &#39;<data:post.commentBase/>&#39;;

// <![CDATA[
      feed += '?alt=json&v=2&orderby=published&reverse=false&max-results=50';
      var cursor = null;
      if (items && items.length > 0) {
        cursor = parseInt(items[items.length - 1].timestamp) + 1;
      }

      var bodyFromEntry = function(entry) {
        if (entry.gd$extendedProperty) {
          for (var k in entry.gd$extendedProperty) {
            if (entry.gd$extendedProperty[k].name == 'blogger.contentRemoved') {
              return '<span class="deleted-comment">' + entry.content.$t + '</span>';
            }
          }
        }
        return entry.content.$t;
      }

      var parse = function(data) {
        cursor = null;
        var comments = [];
        if (data && data.feed && data.feed.entry) {
          for (var i = 0, entry; entry = data.feed.entry[i]; i++) {
            var comment = {};
            // comment ID, parsed out of the original id format
            var id = /blog-(\d+).post-(\d+)/.exec(entry.id.$t);
            comment.id = id ? id[2] : null;
            comment.body = bodyFromEntry(entry);
            comment.timestamp = Date.parse(entry.published.$t) + '';
            if (entry.author && entry.author.constructor === Array) {
              var auth = entry.author[0];
              if (auth) {
                comment.author = {
                  name: (auth.name ? auth.name.$t : undefined),
                  profileUrl: (auth.uri ? auth.uri.$t : undefined),
                  avatarUrl: (auth.gd$image ? auth.gd$image.src : undefined)
                };
              }
            }
            if (entry.link) {
              if (entry.link[2]) {
                comment.link = comment.permalink = entry.link[2].href;
              }
              if (entry.link[3]) {
                var pid = /.*comments\/default\/(\d+)\?.*/.exec(entry.link[3].href);
                if (pid && pid[1]) {
                  comment.parentId = pid[1];
                }
              }
            }
            comment.deleteclass = 'item-control blog-admin';
            if (entry.gd$extendedProperty) {
              for (var k in entry.gd$extendedProperty) {
                console.log(entry.gd$extendedProperty[k].name + ' - ' + entry.gd$extendedProperty[k].value);
                if (entry.gd$extendedProperty[k].name == 'blogger.itemClass') {
                  comment.deleteclass += ' ' + entry.gd$extendedProperty[k].value;
                }
              }
            }
            comments.push(comment);
          }
        }
        return comments;
      };

      var paginator = function(callback) {
        if (hasMore()) {
          var url = feed;
          if (cursor) {
            url += '&published-min=' + new Date(cursor).toISOString();
          }
          window.bloggercomments = function(data) {
            var parsed = parse(data);
            cursor = parsed.length < 50 ? null
                : parseInt(parsed[parsed.length - 1].timestamp) + 1
            callback(parsed);
            window.bloggercomments = null;
          }
          url += '&callback=bloggercomments';
          var script = document.createElement('script');
          script.type = 'text/javascript';
          script.src = url;
          document.getElementsByTagName('head')[0].appendChild(script);
        }
      };
      var hasMore = function() {
        return !!cursor;
      };
      var getMeta = function(key, comment) {
        if ('iswriter' == key) {
          var matches = !!comment.author
              && comment.author.name == authorName
              && comment.author.profileUrl == authorUrl;
          return matches ? 'true' : '';
        } else if ('deletelink' == key) {
          return baseUri + '/delete-comment.g?blogID=' + blogId + '&postID=' + comment.id;
        } else if ('deleteclass' == key) {
          return comment.deleteclass;
        }
        return '';
      };

      var replybox = null;
      var replyUrlParts = null;
      var replyParent = undefined;

      var onReply = function(commentId, domId) {
        if (replybox == null) {
          // lazily cache replybox, and adjust to suit this style:
          replybox = document.getElementById('comment-editor');
          if (replybox != null) {
            replybox.height = '250px';
            replybox.style.display = 'block';
            replyUrlParts = replybox.src.split('#');
          }
        }
        if (replybox && (commentId !== replyParent)) {
          document.getElementById(domId).insertBefore(replybox, null);
          replybox.src = replyUrlParts[0]
              + (commentId ? '&parentID=' + commentId : '')
              + '#' + replyUrlParts[1];
          replyParent = commentId;
        }
      };

      var tok = 'comment-form_';
      var hash = window.location.hash || '';
      var startThread = hash.indexOf(tok) == 1 ? hash.substring(tok.length + 1) : undefined;

      // Configure commenting API:
      var configJso = {
        'maxDepth': 2
      };
      var provider = {
        'id': postId,
        'data': items,
        'loadNext': paginator,
        'hasMore': hasMore,
        'getMeta': getMeta,
        'onReply': onReply,
        'rendered': true,
        'initReplyThread': startThread,
        'config': configJso,
        'messages': msgs
      };

      var render = function() {
        if (window.goog && window.goog.comments) {
          var holder = document.getElementById('comment-holder');
          window.goog.comments.render(holder, provider);
        }
      };

      // render now, or queue to render when library loads:
      if (window.goog && window.goog.comments) {
        render();
      } else {
        window.goog = window.goog || {};
        window.goog.comments = window.goog.comments || {};
        window.goog.comments.loadQueue = window.goog.comments.loadQueue || [];
        window.goog.comments.loadQueue.push(render);
      }
    })();
// ]]>
  </script>
</b:includable>
 4. Setelah ketemu, ganti semua kode tersebut dengan kode berikut ini:
<b:includable id='threaded_comment_js' var='post'>
  <script async='async' expr:src='data:post.commentSrc' type='text/javascript'/>

  <script type='text/javascript'>
    (function() {
      var items = <data:post.commentJso/>;
      var msgs = <data:post.commentMsgs/>;
      var config = <data:post.commentConfig/>;

// <![CDATA[
      var cursor = null;
      if (items && items.length > 0) {
        cursor = parseInt(items[items.length - 1].timestamp) + 1;
      }

      var bodyFromEntry = function(entry) {
        if (entry.gd$extendedProperty) {
          for (var k in entry.gd$extendedProperty) {
            if (entry.gd$extendedProperty[k].name == 'blogger.contentRemoved') {
              return '<span class="deleted-comment">' + entry.content.$t + '</span>';
            }
          }
        }
        return entry.content.$t;
      }

      var parse = function(data) {
        cursor = null;
        var comments = [];
        if (data && data.feed && data.feed.entry) {
          for (var i = 0, entry; entry = data.feed.entry[i]; i++) {
            var comment = {};
            // comment ID, parsed out of the original id format
            var id = /blog-(\d+).post-(\d+)/.exec(entry.id.$t);
            comment.id = id ? id[2] : null;
            comment.body = bodyFromEntry(entry);
            comment.timestamp = Date.parse(entry.published.$t) + '';
            if (entry.author && entry.author.constructor === Array) {
              var auth = entry.author[0];
              if (auth) {
                comment.author = {
                  name: (auth.name ? auth.name.$t : undefined),
                  profileUrl: (auth.uri ? auth.uri.$t : undefined),
                  avatarUrl: (auth.gd$image ? auth.gd$image.src : undefined)
                };
              }
            }
            if (entry.link) {
              if (entry.link[2]) {
                comment.link = comment.permalink = entry.link[2].href;
              }
              if (entry.link[3]) {
                var pid = /.*comments\/default\/(\d+)\?.*/.exec(entry.link[3].href);
                if (pid && pid[1]) {
                  comment.parentId = pid[1];
                }
              }
            }
            comment.deleteclass = 'item-control blog-admin';
            if (entry.gd$extendedProperty) {
              for (var k in entry.gd$extendedProperty) {
                if (entry.gd$extendedProperty[k].name == 'blogger.itemClass') {
                  comment.deleteclass += ' ' + entry.gd$extendedProperty[k].value;
                }
              }
            }
            comments.push(comment);
          }
        }
        return comments;
      };

      var paginator = function(callback) {
        if (hasMore()) {
          var url = config.feed + '?alt=json&v=2&orderby=published&reverse=false&max-results=50';
          if (cursor) {
            url += '&published-min=' + new Date(cursor).toISOString();
          }
          window.bloggercomments = function(data) {
            var parsed = parse(data);
            cursor = parsed.length < 50 ? null
                : parseInt(parsed[parsed.length - 1].timestamp) + 1
            callback(parsed);
            window.bloggercomments = null;
          }
          url += '&callback=bloggercomments';
          var script = document.createElement('script');
          script.type = 'text/javascript';
          script.src = url;
          document.getElementsByTagName('head')[0].appendChild(script);
        }
      };
      var hasMore = function() {
        return !!cursor;
      };
      var getMeta = function(key, comment) {
        if ('iswriter' == key) {
          var matches = !!comment.author
              && comment.author.name == config.authorName
              && comment.author.profileUrl == config.authorUrl;
          return matches ? 'true' : '';
        } else if ('deletelink' == key) {
          return config.baseUri + '/delete-comment.g?blogID='
               + config.blogId + '&postID=' + comment.id;
        } else if ('deleteclass' == key) {
          return comment.deleteclass;
        }
        return '';
      };

      var replybox = null;
      var replyUrlParts = null;
      var replyParent = undefined;

      var onReply = function(commentId, domId) {
        if (replybox == null) {
          // lazily cache replybox, and adjust to suit this style:
          replybox = document.getElementById('comment-editor');
          if (replybox != null) {
            replybox.height = '250px';
            replybox.style.display = 'block';
            replyUrlParts = replybox.src.split('#');
          }
        }
        if (replybox && (commentId !== replyParent)) {
          document.getElementById(domId).insertBefore(replybox, null);
          replybox.src = replyUrlParts[0]
              + (commentId ? '&parentID=' + commentId : '')
              + '#' + replyUrlParts[1];
          replyParent = commentId;
        }
      };

      var hash = (window.location.hash || '#').substring(1);
      var startThread, targetComment;
      if (/^comment-form_/.test(hash)) {
        startThread = hash.substring('comment-form_'.length);
      } else if (/^c[0-9]+$/.test(hash)) {
        targetComment = hash.substring(1);
      }

      // Configure commenting API:
      var configJso = {
        'maxDepth': config.maxThreadDepth
      };
      var provider = {
        'id': config.postId,
        'data': items,
        'loadNext': paginator,
        'hasMore': hasMore,
        'getMeta': getMeta,
        'onReply': onReply,
        'rendered': true,
        'initComment': targetComment,
        'initReplyThread': startThread,
        'config': configJso,
        'messages': msgs
      };

      var render = function() {
        if (window.goog && window.goog.comments) {
          var holder = document.getElementById('comment-holder');
          window.goog.comments.render(holder, provider);
        }
      };

      // render now, or queue to render when library loads:
      if (window.goog && window.goog.comments) {
        render();
      } else {
        window.goog = window.goog || {};
        window.goog.comments = window.goog.comments || {};
        window.goog.comments.loadQueue = window.goog.comments.loadQueue || [];
        window.goog.comments.loadQueue.push(render);
      }
    })();
// ]]>
  </script>
</b:includable>
 5. Simpan Template

Dengan hanya mengganti script tersebut, beberapa blog Saya yang mengalami error pada kolom komentar ternyata sudah bisa berfungsi normal.

UPDATE!!


Sejak blogspot mengaktifkan HTTPS sebagai tambahan proteksi blogspot, terjadi banyak error dengan kolom komentar yang kebanyakan masalahnya sama, yaitu loading terus. Jadi ini adalah imbas pemakaian HTTPS yang diterapkan oleh blogger.

Nah sebenarnya untuk mengatasinya cukup mudah, tips ini saya dapatkan dari blognya Kang Adhy dengan kompiajaib.com nya.

Langkah Pertama

Pada kode HTML template blog Anda, cari kode berikut <b:includable id='comment-form' var='post'>
Kemudian coba scroll ke bawah dan cari kode seperti ini atau yang mirip seperti ini :
<a expr:href='&quot;//www.blogger.com/comment-iframe.g?blogID=&quot; + data:blog.blogId + &quot;&amp;amp;pageID=&quot; + data:post.id' id='comment-editor-src' title='comment editor'/>

Tambahkan kode https: , sehingga kode menjadi :
<a expr:href='&quot;https://www.blogger.com/comment-iframe.g?blogID=&quot; + data:blog.blogId + &quot;&amp;amp;pageID=&quot; + data:post.id' id='comment-editor-src' title='comment editor'/>
Scroll ke bawah lagi dan temukan kode yang mirip seperti di atas, lalu ganti dengan https: dengan cara yang sama.

Langkah Kedua

Cari kode berikut <b:includable id='threaded-comment-form' var='post'>
Lalu lakukan seperti pada langkah pertama di atas.

Setelah melakukan langkah tersebut dengan benar, seharusnya kolom komentar sudah tidak mengalami error lagi. Semoga bermanfaat

Comments

  1. Admin Galeri IslamApril 30, 2016 at 10:58 AM

    selamat malam admin, saya sudah mencoba tips pada tulisan ini. namun gagal, mungkin template saya sedikit berbeda. dan Alhamdulillah saya sudah menemukan solusinya tanpa mengganti script diatas. saya sudah menulisnya dalam sebuah artikel diblog saya.

    ReplyDelete
  2. UnknownMay 27, 2016 at 2:50 AM

    Blog saya debetimes.blogspot.com masih belum bisa gan, mohon bantuanya.

    ReplyDelete
  3. Gubuk PintarJune 1, 2016 at 8:59 AM

    Saya coba dulu broo heheheh

    ReplyDelete
  4. UnknownJune 25, 2016 at 3:33 PM

    Terima Kasih...
    Berhasil gan template saya cuma tidak ada huruf 'S' nya saja ..

    ReplyDelete
    Replies
    1. Empyeng KedetJuly 1, 2016 at 10:48 PM

      betul gan, kebanyakan karena pemberlakuan https itu yang bikin lumayan banyak error di kolom komentar. trimakasih kunjungannya.. :D

      Delete
  5. ChrisSeptember 14, 2016 at 1:58 PM

    thanks gan berhasil ane cukup dengan menganti http menjadi https kolom komennya udah ga loading lg.

    ReplyDelete
  6. CakJieOctober 14, 2016 at 6:19 PM

    terima kasih sangat membantu

    ReplyDelete
  7. Wikarso FahriJanuary 4, 2017 at 8:58 AM

    Alhamdulillah berhasil gan. terima kasih atas tutorialnya. Tapi jadinya ada space sisa di bawah komentar. Padahal tidak ada tag '
    ' atau yang lainnya.

    ReplyDelete
  8. Ach ArtJanuary 24, 2017 at 2:55 PM

    Sudah work bang. Makasih

    ReplyDelete
  9. OnniApril 1, 2017 at 11:28 PM

    THANKS FULL...its WORK, bekerja gan tipsnya (y)

    ReplyDelete

Post a Comment

Popular Posts

5 template blogspot toko online terbaik dan gratis

Template blogspot untuk toko online yang terbaik dan gratis sudah banyak bertebaran di internet. Namun kali ini tips SEO terbaik akan membagikan informasi khusus untuk template blogger toko online terbaik sekaligus SEO namun tetap gratis khusus untuk pengunjung blog ini. Pilihan untuk template blogspot toko online banyak sekali, bahkan untuk template blogspot toko online yang gratis pun banyak yang memiliki kualitas seperti halnya template premium alias template berbayar. Informasi mengenai template toko online blogspot gratis ini sengaja dibagikan di blog ini untuk memudahkan anda menentukan pilihan mengenai template yang paling cocok dan sesuai untuk memajang produk-produk anda. Baca tips SEO dan alternatif template toko online terbaru lainnya berikut: Cara submit sitemap terbaru di google webmaster Gratis 9 Template Toko Online Blogspot Full Responsive Semua template yang diinformasikan di sini ada yang memiliki fitur shopping cart dan ada yang tidak sehingga bisa menyesua
25 comments
Read more

Memasang Widget Recent Post Berdasar Label dengan Thumbnail Paling Mudah

Sampai saat posting ini diterbitkan, blogspot belum pernah secara khusus dan resmi merelease widget recent post (post terbaru) berdasarkan label. Hanya ada widget recent post berdasarkan posting terbaru dan widget archive yang berisi semua posting. Padahal widget seperti ini sebenarnya cukup banyak dibutuhkan oleh blogger. Khususnya jika memiliki blog yang memiliki topik majalah atau berita. Berikut ini akan Saya bagikan script untuk membuat dan menambahkan widget recent post berdasarkan label. Ada dua tipe yang ingin Saya bagikan. Yang pertama adalah untuk widget recent post label yang memiliki fitur thumbnail dilengkapi dengan judul dan deskripsi posting. Sedangkan yang kedua adalah untuk recent post based label yang hanya menampilkan thumbnail saja. Panduan yang dibagikan di sini sengaja Saya pilihkan yang paling mudah, yaitu cukup memasangnya atau mengcopy script dengan sedikit editing untuk penyesuaian dengan blog Anda, dan memasangnya (Paste) ke dalam widget HTML/Javascri
1 comment
Read more

Cara Menambahkan Shopping Cart di Template Blogspot

Bagaimana cara menambahkan shopping cart ke template blogspot? Seringkali Tips SEO Terbaik menerima pertanyaan ini. Nah tulisan kali ini akan mencoba memberikan panduan mengenai cara memasang shopping cart ke template blogspot. Shopping cart yang dipasang adalah dengan checkout via paypal. Panduan memasang atau menambahkan shopping cart ke template blogspot ini sebenarnya pernah ditulis oleh Kangismet di blognya blog.kangismet.com.  Script shopping cart sendiri diambilkan dari scriptnya simplecart buatan thewoojogroup.com . Pemakaian SimpleCart.js ini sangat cocok untuk platform blogspot yang tidak menggunakan php. Pemasangannya sebenarnya cukup sederhana. Sebelum membaca lebih lanjut panduan menambahkan shopping cart di template blogspot ini ada baiknya anda melihat dulu live demonya DISINI Berikut panduannya. Memasang Script Shopping Cart di Template Langkah 1. Pastikan template anda sudah memasang  frame works jquery di template anda, jika belum simpan script berik
21 comments
Read more