Comments Opened!
When I've migrated my blog to Ghost (My Wordpress to Ghost Journey) I've left a few things not done. Quite a few actually. Integrating a comments service was one of them.
Last year, I didn't have much time for the blog, and the little time I had went into writing posts, so the TODOs list remained quite the same. Now, its time take them one by one, so expect some more improvements soon.
Today I've integrated Disqus, and I invite you to comment on my posts!
Below are a few technical details on how this went in my case.
Integrating Disqus into a Ghost blog
As expected it was very simple to add Disqus. I've just followed the steps from this tutorial, which even if it is a bit out of date, it tells very well the steps that are needed.
After I've created the account and accepted the policy, at the Select Platform step, I had Ghost as an option,
so I didn't go for the Universal Code, like the tutorial says, even if I think it would have been pretty much the same.
Next, at the Install Instructions Disqus tells the exact installation steps:
Howerver, the step 2, is not very accurate. Actually, it should say to insert the code anywhere between the {{#post}} and its ending tag {{/post}}.
Depending on your theme, you might have a footer section, like I have, and you'd probably want the Disqus comments to go in there and not at the end of the article. In my case, I wanted it inside the footer, so it gets its styling, but after the author and the share this post sections, so the code went inside <footer> which is inside {{#post}}.
and the result is
For the Configuration Variables from the discus_config function, I've just followed the instructions from the tutorial, so I had:
var disqus_config = function () {
this.page.url = '{{url absolute="true"}}';
this.page.identifier = 'gh-{{id}}';
};
The page.identifier might require some thinking. If we look into Disqus documentation it says that this variable is used to uniquely identify the comments thread that should be shown in the post. So, indeed the {{post.id}} seems a good idea. However, this id is nothing more than an integer that is incremented by ghost with each page or post we add. What if I will migrate from Ghost to another platform? The alternative would be not to use it and to rely only on the post.url, which change is supported by Disqus Migration Tools. However, on the other hand, I might need to change the URL before a migration for other reasons, like a title rename, or a typo. In the end, I've concluded that I'll use it with the gh- prefix, because:
- it is more probable to change the post URL due to a typo than to do a migration ;)
- even if I migrate, I could probably keep this ID on the new platform. If not, it will just not be set. If it is not set, Disqus will fall back and use the URL. So, after an eventual migration, I should not change the URLs of the migrated posts.
- the
gh-prefix makes it more explicit saying that this is an ID generated by Ghost. Plus, I can use another prefix likedev-gh-when I test the comments from my test env, using the same Disqus account.
The last thing was to do a quick test and look at the page source to see if these variables are set as expected:
And, with this you can comment on my blog, including on the previous posts. If you have questions, comments or suggestions on this, you can, now, directly ask them below.