Developer docs

A complete guide to adding comments to posts in Ghost

In this guide we’ll take you through the steps required to add comments to your articles, so people viewing your content can post replies directly on the article.

One way of communicating with your readers is by adding the ability for people to comment on your content. There are a variety of tools that do this, and do so in different ways, so it’s best to pick the tool for your purpose. Take a look at our Community Integrations and see which would be best for your community.

Adding the code

Navigate to the Design view in the Ghost admin and download the theme you’re using on the site. Open the post.hbs in any code editor and locate a place in the markup in which you want the comments to render.

If you’re using Casper you’ll see the following section of code:

{{!--
<section class="post-full-comments">
    If you want to embed comments, this is a good place to do it!
</section>
--}}

The code you replace these lines with will depend on the integration you’re planning on using. Navigate to the tool you want to use within our Community Integrations for more details on implementation.

Connect and verify

Depending on the service being used you’ll need to follow some additional steps to make the service aware of the code you’re running on your Ghost site. Follow the instructions provided on the integration page and on the service’s own documentation.

The final step is to verify that the commenting tool by testing it yourself. It’s important to test these tools out as you make end up finding out it’s not working from the very first member of your audience using it for themselves. Navigate to one of your published posts and submit a comment, if the comment appears as expected you’re all good to go!

Extending with Members

With Members it’s possible only provide this commenting feature to your closed community of members. Wrapping your comments section with the access helper will restrict access to only your members.

{{#if access}}
<!-- Your commenting service -->
{{else}}
<p>By becoming a member you can reply to the author:</p>
<form data-members-form>
    <input data-members-email type="email" required="true" />
    <button type="submit">Continue</button>
</form>
{{/if}}

If you want to find out more about Members and how using related helpers within Ghost then check out our Members documentation.

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. Don’t forget to check out our theme documentation for more ways to control the look of your site and our array of integrations to further enhance your site.