Intergration Disqus Comment Count

support
1

Hi,

I am trying to update my gohugo page with a comments counter. This is my actual disqus code:

<div id="disqus_thread"></div>
<script type="text/javascript">

(function() {
if (window.location.hostname == "localhost")
return;

var disqus_config = function () {
this.page.url = '{{ .URL }}';
this.page.identifier = '{{ .UniqueID }}';
this.page.title = '{{ .Title }}';
};

var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
var disqus_shortname = '{{ .Site.DisqusShortname }}';
dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();
</script>
<noscript>Please enable JavaScript to view the comments.</noscript>

My comments link:

<li>
<a href="{{ .URL }}#disqus_thread" class="disqus-comment-count" data-disqus-identifier="{{ .UniqueID }}"><i class="icon-comments"> Comments</a>
</li>

And just before the closing body tag:

<script id="dsq-count-scr" src="//storecore.disqus.com/count.js" async=""></script>	
</body>

However. The comments link is never updated to include the actual amount of comments.

What am I doing wrong?

2

Golang templates are finicky when it comes to embedding scripts. I know this probably seems like a pain in the ass right now, but it’s actually for a good reason. I’m guessing it’s escaping the values you’re adding. Take a look at the safeJS templating function.

3

I’m not sure. You mean like so?

<a href="{{ .URL | safeJS }}#disqus_thread" class="disqus-comment-count" data-disqus-identifier="{{ .UniqueID | safeJS }}"><i class="icon-comments"></i> Comments</a>

with or without safeJS functon the outcome is:

<a href="//myurl.com/this-is-the-fourth-blog-item/#disqus_thread" class="disqus-comment-count" data-disqus-identifier="0405598992da85f385b34f1e58b5cfff"><i class="icon-comments"></i> Comments</a>

4

Subtle bump. Can anyone help me?

5

Can you point me to a repo and the template in question?

One thing might be using Permalink instead of URL but that’s untested and HM writing this from my phone :smile:

6

I know it is an old thread and hopefully it will help someone in future since I have just implemented it.

Add the following code to your .html page.

	<div class="comment-count">
	<a href="{{ .Permalink }}#disqus_thread">Comments</a>
	</div>

Add this script to head.html or where ever you call the script.

<script id="dsq-count-scr" src="https://YOUR-SHORTNAME.disqus.com/count.js" async></script>

Style the output via .css like below.

.comment-count {
  font-family: Georgia, "Times New Roman", Times, serif;
  float: right;
  font-size: 19px;
  text-decoration: none;
}

Please note that you might not see the comment count for about a couple of seconds and it will pop in once the script loads the value.