🚀 Mindspun Payments Launch Offer

Miscellaneous

Tandem X Visuals Fzooxr2auvi Unsplash.jpg

Adding Comments to Ghost

Easily adding comments is not a feature that Ghost has out of the box.  Fortunately there are multiple methods for adding comments, depending on your requirements, and they are all relatively straightforward.  This article will show you how to add the two of the most popular third-party options: Disqus and Facebook.

Ghost Comments with Disqus

Adding Disqus comments to your Ghost site requires you to modify your Ghost theme.

The Disqus website contains instructions for Ghost but these instructions tell you to update your theme in place which is not possible if you using a hosted Ghost site and just not a good idea otherwise.  Changes made in this fashion – if possible at all – are easy to overwrite – and lose – if you update your theme.   A far better approach is to edit your theme separately as described in the above link so that any changes you make – for comments or otherwise – are backed up.

Installation of Disqus comments into your Ghost site is done by inserting the below code snippet in the post.hbs template of your theme.  The only change required is to replace EXAMPLE with your Disqus account name.  (Your Disqus account will clearly show you what this value should be.)

<div id="disqus_thread"></div><noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>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);})();

The <div> tag with id disqus_thread where the comments will be displayed so this code should be placed where you want that to happen.

If you are using the standard Casper theme, the theme suggests where to place the code.

Remove lines 117 and 121 (those are HTML comments that disable the section) and replace line 119 with the above code.

Subscribe for Email Updates

Everything an ambitious digital creator needs to know.