How to Display the Number of Disqus Comments on a Blog

As you already know, this disqus is very suitable for a place to comment as well as responsive and easy to integrate with any platform.

But it is undeniable that there are still many shortcomings that we can find one of them on sites that use AMP (Accelerate Mobile Pages). While the disadvantage itself lies in the number of visitor comments that do not appear, in contrast to Non AMP sites that can be manipulated using javascript or jquery.

But calm down friend, because now you can display the number of disqus comments even if your site uses AMP (Accelerate Mobile Pages). Previously, I myself was also worried about using disqus because of its shortcomings, but after the Malestea.com blog provided a solution by using json as an alternative.

For those of you who use the theme or template AMP (Accelerate Mobile Pages) and are also curious how to integrate it with disqus but without bugs, you can follow the tutorial that will be described below.

How to Display the Number of Disqus Comments

If you use an AMP theme or template, then you will need help from json while to call it we need the help of amp-list and amp-mustache. With this help, it can be confirmed that this script can display the number of comments according to the title of the article or post on your respective blogs.

Here's how to install it so that the number of disqus comments can appear if you use the theme or template AMP (Accelerate Mobile Pages)

1. Log in to the Blogger.com dashboard first.
2. Then please select Theme menu> Edit HTML
3. You can then add the following code above the </head> code

   <script async='async' custom-element='amp-list' src='https://cdn.ampproject.org/v0/amp-list-0.1.js'/>
   <script async='async' custom-template='amp-mustache' src='https://cdn.ampproject.org/v0/amp-mustache-0.2.js'/>

4. Then add the following code as you wish.

   <div class='comment-disqus'>
      <a expr:href='data:post.url + &quot;#disqus_thread&quot;' expr:title='data:messages.comments'>
         <amp-list expr:src='&quot;//shortname.disqus.com/count-data.json?url=&quot;+data:post.url' height='20' layout='fixed-height' width='auto'>
            <template type='amp-mustache'>
               <span>{{comments}} comments</span>
            </template>
         </amp-list>
      </a>
   </div>

   Note: In the section I marked, please change it according to your respective disqus shortname.
5. Finally you can click Save Theme to apply the changes you have made.

Please note, that the script code above will adapt itself to each url in your blog post. So you do not have to bother to create it manually one by one in the script. If you have any questions or are still confused with the tutorial above, you can ask directly through the comment field provided under this article or directly to the source or owner of this article, namely MalesTea.

Maybe that's all for the first article from How to Display the Number of Disqus Comments on a Blog that I can give this time. If there are any wrong words or writing I hope you can still understand and hopefully always useful. Thank you.

Source: https://www.malestea.com/2021/01/jumlah-komentar-disqus.html