How to properly integrate Disqu with Statiq/Wyam

[TechWatching]

I am currently using Disqu to have a comment system on my blog. It works fine on my blog site but I cannot see the comments on the Disqu website. After reading Disqu website I have seen that it is due to thread discussion created when previewing the blog locally. https://help.disqus.com/en/articles/1717128-why-are-the-wrong-urls-detected-for-my-discussions

How to handle that so that even if I am running my website locally, disqu uses the website true URI ?

[daveaglick]

The trick is to figure out a key that doesn't change based on the client-side host name. For example, this is what I do on my blog:

<script type="text/javascript">
    /* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
    var disqus_shortname = 'somedave'; // required: replace example with your forum shortname
    var disqus_identifier = '@Model.Destination.FileNameWithoutExtension.FullPath';
    var disqus_title = '@Model.GetString(WebKeys.Title)';
    var disqus_url = '@Context.GetLink(Model, true)';
    /* * * DON'T EDIT BELOW THIS LINE * * */
    (function() {
        var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
        dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
    })();
    
    (function () {
        var s = document.createElement('script'); s.async = true;
        s.type = 'text/javascript';
        s.src = '//' + disqus_shortname + '.disqus.com/count.js';
        (document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);
    }());
</script>

Notice that the identifier for Disqus is based only on the file name so the host doesn't come into play.

[daveaglick]

See also https://help.disqus.com/en/articles/1717082-what-is-a-disqus-identifier

[TechWatching]

Well I already have almost the same script . The only differences are these 2 lines :
var disqus_identifier = '@Model.FilePath(Keys.RelativeFilePath).FileNameWithoutExtension.FullPath'; var disqus_title = '@Model.String(BlogKeys.Title)';

because I am using Wyam and have not migrated to Statiq.Web yet (waiting the GA of v1 to do so 😉).
But I guess it should be okay nevertheless but unfortunately it is not, I can't see comments on Disqu web site.