The complete guide to comments
Comments can jump-start the conversation on your publication and give your community a place to engage with one another. This tutorial will walk you through the process of adding comments to your Ghost theme.
Give the people a voice and let them reply to your article directly with comments.
Ghost integrates with a variety of commenting platforms so that you can find a platform that meets your publication’s needs. Check out our Community Integration page to find guides on integrating your chosen platform with Ghost.
This tutorial will cover the steps you’ll take to connect most commenting platforms to your Ghost site.
Add the code
Open a copy of your theme in the code editor and go to the post.hbs
file.
If you’re using Casper, you’ll see the following section of code (beginning at line 76):
{{!--
<section class="article-comments gh-canvas">
If you want to embed comments, this is a good place to paste your code!
</section>
--}}
Other themes might do things differently. For example, Ghost’s Ease theme uses a partial
called comment.hbs
. No matter these differences, the takeaway here is that you’re looking for the spot on your post page where you want your comments to appear. Generally, this will be after your main content.
The next step is to add the code for your commenting platform to this location in post.hbs
. Navigate to the tool you want to use within our Community Integrations for more details on how to do this or follow the instructions provided by your commenting platform.
Once the commenting code is added, zip up your theme files and upload them to your Ghost site.
Connect and verify
Verify that the commenting tool works by testing it yourself. Navigate to one of your published posts and submit a comment – maybe something about how great your publication is 😉 – if the comment appears as expected, you’re all good to go!
Members only
With Ghost, not only can you add the commenting platform of your choice, but you can also restrict access to your publication’s members. All in one extra line of code.
Wrapping your comments section with the access
helper will restrict comments to members only.
{{#if access}}
<!-- Your commenting service -->
{{else}}
<p>You're missing out on the conversation. Become a member and join in.</p>
<a href="#/portal/">Subscribe</a>
{{/if}}
Demo
In this demo, we added Disqus comments to Casper:
Summary
Woop! You’ve now added commenting to your Ghost site, and even found a way to scope commenting to your closed group of members. And, if you’re eager to keep on commenting, come over to our Forum, where the conversation is nothing short of lively.