Cara Menggunakan Komentar Disqus di Template Infastio

BlogSeba 4 min read
Disqus Comment System on Infastio Blogger Template
image: wordpress.org/plugins/disqus-comment-system/

Edit HTML

  1. Cari
    <b:defaultmarkup type='Common'>
  2. Paste kode ini dibawahnya
    <b:includable id='disqus-comment' var='post'>
      <script>
      var disqus_blogger_current_url = &quot;<data:blog.canonicalUrl/>&quot;; if (!disqus_blogger_current_url.length) { disqus_blogger_current_url = &quot;<data:blog.url/>&quot;; } var disqus_blogger_homepage_url = &quot;<data:blog.homepageUrl/>&quot;; var disqus_blogger_canonical_homepage_url = &quot;<data:blog.canonicalHomepageUrl/>&quot;;
      </script>
    </b:includable>
  3. Cari dan ubah
    <b:include data='post' name='commentPicker'/>
    Menjadi
    <!-- <b:include data='post' name='commentPicker'/> -->
    Paste kode ini dibawahnya
    <b:if cond='data:view.isSingleItem'>
      <div id='disqus_thread'>
      <div id='disqus_empty'/></div>
      <b:if cond='data:blog.isMobileRequest == &quot;true&quot;'><b:include data='post' name='disqus-comment'/></b:if>   
      <script>
      //<![CDATA[
      function load_disqus(e){var t=document.getElementById("disqus_empty"),d=document.getElementById("disqus_thread"),n=document.createElement("script"),s=document.createElement("script"),o=document.getElementsByTagName("head")[0]||document.getElementsByTagName("body")[0];d&&t&&(n.type="text/javascript",n.async=!0,n.src="//"+e+".disqus.com/embed.js",o.appendChild(n),s.type="text/javascript",s.async=!0,s.src="//"+e+".disqus.com/blogger_item.js",o.appendChild(s),t.remove())}window.addEventListener("scroll",function(e){var t=document.scrollingElement.scrollTop,d=document.getElementById("disqus_thread");d&&t>d.getBoundingClientRect().top-150&&(load_disqus("catatandroid"),console.log("Disqus loaded."))},!1);
      //]]>
      </script>
    </b:if>
    Perhatikan load_disqus("catatandroid"), ganti catatandroid dengan username disqus kalian.
  4. Cari dan ubah
    <i><data:post.numberOfComments/></i>
    Menjadi
    <!-- <i><data:post.numberOfComments/></i> -->
  5. Cari dan ubah
    <b:include name="ic-chat"/><b:message name='messages.numberOfComments'> <b:param expr:value='data:post.numberOfComments' name='numComments'/> </b:message>
    Menjadi
    <b:include name="ic-chat"/><data:messages.postAComment/>

Widget Layout

  1. Pada infastio settings ubah var recentComment menjadi false. var recentComment = false;
  2. Tambahkan css ini di widget additional css
    .comment-info { display: none; }

Perhatian

  • Widget Disqus ini berjalan secara lazy on scroll, akan muncul jika ada aktifitas scroll pada layar.
  • Widget Disqus ini tidak termasuk fitur recentComment dan totalComment

BlogSeba
BlogSeba Hello BlogSeba members, we have been writing articles on various topics since 2023. Thank you for being with us.
Post a Comment
Search
Menu
Theme
Share