Using your own comments solution for Jekyll

Written by
Date: 2013-06-20 13:22:35 00:00

I have been blogging with the help of Jekyll for more than two years I think, and during this time I have enabled and disabled comments. I have used Disqus, Facebook, livefyre, and a plugin to manage the comments as emails.

Among all the third party comment system Disqus is the best one for me, it works great, you can moderate via email, the spam protection is great, etc. I find one bad thing anyway it is third party hosted. I have trying to stay away from the cloud as much as I can, and having the comments of my blog on Disqus is something I don't like that much.

Anyway I think I have found another solution for comments, and this time it will be hosted by me. It all started yesterday, I was testing software and thinking about starting a forum, reading about forums I came up to Vanilla Forum software. After installing and testing it I realized that you can use it easily to manage blog comments. Let's see how to do it.

How to use Vanilla forum to power comments on Jekyll blogs

First thing is to install Vanilla forum on your server, I am not going to cover that here, because it is really easy.

  • Have a LAMP server (Or Nginx, PHP-FPM and MySQL)
  • Download the code of Vanilla forum
  • Create a Database for the forum
  • Unpack the code in your virtual server's folder
  • Point your browser to the url of your forum and configure

Once installed and running, prepare Vanilla forum to work as a comment platform.

Set up Vanilla Forum commenting system

Go to the dashboard. http://your-forum-domain.com/forum-path/dashboard/settings, then look for Forum Settings.

Vanilla Forum Settings

click on Blog Comments and then enable then click on Enable Embedding, it should look like this after that.

Blog comments

Finally add this code to your post layout in your Jekyll blog.

<div id="vanilla-comments"></div> <script type="text/javascript"> 
/*** Required Settings: Edit BEFORE pasting into your web page ***/ 
var vanilla_forum_url = 'http://extra.garron.me/en/forum/'; // The full http url & path to your vanilla forum 
var vanilla_identifier = '{{ page.id }}'; // Your unique identifier for the content being commented on 
/*** Optional Settings: Ignore if you like ***/ 
// var vanilla_discussion_id = ''; // Attach this page of comments to a specific Vanilla DiscussionID. 
var vanilla_category_id = '6'; // Create this discussion in a specific Vanilla CategoryID. 
/*** DON'T EDIT BELOW THIS LINE ***/ 
(function() { 
    var vanilla = document.createElement('script'); 
    vanilla.type = 'text/javascript'; 
    var timestamp = new Date().getTime(); 
    vanilla.src = vanilla_forum_url + '/js/embed.js'; 
    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(vanilla); })(); 
</script> 
<noscript>Please enable JavaScript to view the <a href="http://vanillaforums.com/?ref_noscript">comments powered by Vanilla.</a></noscript>

Make sure you modify these two lines:

 var vanilla_forum_url = 'http://extra.garron.me/en/forum/' // The full http url & path to your vanilla forum
 var vanilla_category_id = '6'; // Create this discussion in a specific Vanilla CategoryID.

The first one, should be the complete path to your forum installation, and the second one is the ID of the category where you want comments to appear, it can be ommited (commented out or deleted), and in that case all comments will go to the General category.

That is it, now just.

 git add -A
 git commit -m 'added vanilla forums as commenting system'
 git push webserver master

You are using git right?