How to: Add Disqus to your Jekyll site

You will need to modify the file `_layouts/default.html` and include the line:

{% include comments.html %}

You will then need to create the file _includes/comments.html which includes this code snippet which is provided by Disqus:

{% if page.comments %}
<!-- Add Disqus comments. -->
<div id=”disqus_thread”></div>
<script type=”text/javascript”>
/* CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE */
// required: replace example with your forum shortname
var disqus_shortname = ‘<USERNAME>’;

var disqus_identifier = “{{ site.disqusid }}{{ page.url | replace:’index.html’,’’ }}”;
      /* * * DON’T EDIT BELOW THIS LINE * * */
(function() {
var dsq = document.createElement(‘script’);
dsq.type = ‘text/javascript’; dsq.async = true;
dsq.src = ‘//’ + disqus_shortname + ‘.disqus.com/embed.js’;

(document.getElementsByTagName(‘head’)[0] ||
document.getElementsByTagName(‘body’)[0])
.appendChild(dsq);
})();
</script>
<noscript>
Please enable JavaScript to view the
<a href=”http://disqus.com/?ref_noscript”>
comments powered by Disqus
</a>
</noscript>
<a href=”http://disqus.com" class=”dsq-brlink”>
comments powered by
<span class=”logo-disqus”>Disqus</span>
</a>
{% endif %}

Setting up the code this way allows you to enable commenting on a page-by-page basis. All that is needed to enable comments is to set `comments: True` in the YAML header of the post.

Like what you read? Give Alan Reid a round of applause.

From a quick cheer to a standing ovation, clap to show how much you enjoyed this story.