How to Add Comments to Ghost Blog

Posted in Ghost, Disqus, Comment, Guide, node.js

Ghost is a blog system using node.js that I reccently discovered. The moment I saw the clean interface, I fall in love with it. However, without a commenting system in a blog, it lacks interaction with readers. This is why we are going to add this feature to our Ghost.

1. Get your Disqus account

We are using Disqus to show how to add comments to Ghost, but it normally applies to all other similar comments system. Go to Disqus to create a new account and follow the steps on the page and email to finish your registration. Pay attention to you Disqus shortname, we gonna need it later.

2. Navigate to your Ghost installation folder

If you are using a VPS with Nginx installed, you might have your Ghost in: /var/www/ghost.

3. Open post.hbs for editing

You can find post.hbs in /ghost/content/themes/casper/post.hbs.

4. Put the code for Disqus in post.hbs

This is the tricky part. You may find a very vague instruction to ask you to:

paste the code between {{/post}} and </article>

I know how frustrating trying to follow instructions like this. Today, I'm going to show you the clearest and easiest way to do this. Here we go...

Find this code block:

<section class="post-content">
    {{content}}
</section>

Type this right under the above block:

 <section class="comment">
    {{Disqus}}
 </section>

Paste the code block from your Disqus account and replace the "{{Disqus}}" above.

Disqus code for html

# 6. Replace example with your shortname

Remember the shortname I told you to pay attention to? This is where we need it. Put your shorname in between of the '' to use your own Disqus.

# 7. Restart your Ghost

Enjoy!

Please share your thoughts with me and let me know what your like to read.
Stay tuned for more from Wei's Blog!