Disqus + Ghost

How to use Ghost and Disqus together

If you’re in need of a quick way to get fully-functional commenting on a Ghost site, Disqus may be what you’re looking for

Disqus allows you to embed comment threads within Ghost posts and pages, including additional functionality like upvoting and adding Emoji reactions. The platform is widely adopted and relatively easy to set up, so you’ve probably come across it before.

Setting up Disqus with Ghost involves installing their comment embed code into your theme, and making some small adjustments.

Note: While Disqus is free, it was acquired by an ad-tech company in 2017 and may inject advertising and ad-trackers on your site.

Copy the Ghost-Disqus comment code

First, copy this Ghost-Specific Disqus comment code onto your clipboard. This is not the same as the Disqus Universal Code, but is customised specifically for Ghost themes:

<div id="disqus_thread"></div>
<script>
    var disqus_config = function () {
        this.page.url = "{{url absolute="true"}}";
        this.page.identifier = "ghost-{{comment_id}}"
    };
    (function() {
    var d = document, s = d.createElement('script');
    s.src = 'https://EXAMPLE.disqus.com/embed.js';
    s.setAttribute('data-timestamp', +new Date());
    (d.head || d.body).appendChild(s);
    })();
</script>

Paste the comment code into post.hbs

A good spot for this code is after the content in the template file. In Ghost’s official themes, remove the {{#if comments}} block and replace the {{comments}} helper with your Disqus code:

Update the the comments block with your code
Comments block updated with Disqus code

Find your Disqus shortname

Next you’ll need to visit Disqus Admin, and create a site or select an existing one. From the site’s settings area, find the shortname and copy it.

Insert your shortname into the Disqus code

Lastly, find the line of code in your post.hbs file which says:

s.src = 'https://EXAMPLE.disqus.com/embed.js';

and replace EXAMPLE with your shortname. Then save the file, upload a fresh copy of your theme, and restart Ghost. Comments should now be loading on your site.

Add automation to comments

To take things further, you might want to add automation to your comments using Zapier. Notifications for new comments posted to your site can be particularly useful! Here are a few ideas to get started: