Skip to content

Adding Disqus to Plerd

Jason McIntosh edited this page Aug 25, 2017 · 2 revisions

You can add Disqus to your Plerd-based blog by updating one of its template files. By following the instructions on this page, you'll set up Plerd to display comment counts on its recent-posts page, and full-on comment sections on posts' individual pages.

There's more than one way to do it, of course, and these instructions assume a set of templates not too terribly customized from Plerd's default set. Please do modify these instructions as needed to suit your own tastes and needs.

This information is current as of August 2017.

Step 1: Set up Disqus

If you haven't already done so, go to disqus.com, create an account, and set up support there for your blog.

Step 2: Know your blog's Disqus "shortname".

You chose a shortname for your blog when setting it up with Disqus, and you need to know what that is in order to complete the rest of these steps.

If you need to refresh your knowledge of this, visit your blogs's general configuration settings while logged into Disqus.

Step 3: Modify your post.tt template.

In all the following steps, replace "SHORTNAME" in the code snippets with your blog's Disqus shortname.

  1. Paste this at the bottom of your post.tt file:

    [% UNLESS context_post %]
      <script id="dsq-count-scr" src="http://SHORTNAME.disqus.com/count.js" async></script>
    [% END %]
    

    This will load Disqus's count.js script, which allows us to display comment counts outside of comment sections. (And it will load it only when context_post is undefined, which is to say: only for the recent-posts page.)

  2. Paste this underneath the [% body %] invocation within post.tt:

    [% UNLESS context_post %]
        <a class="disqus-comment-count" data-disqus-url="[% post.uri %]#disqus_thread" href="[% post.uri %]#disqus_thread">0 Comments</a>
    [% END %]
    

    This will direct Disqus to display "N Comment(s)" under each post's text in your blog's recent-posts view. If Disqus doesn't have this information, then your blog will display the default text of "0 Comments".

  3. Paste this near the end of the file, right above the final [% END %] tag (the one that delineates the [% FOR post IN posts %] loop). This stuff will display

    [% IF context_post %]
    <div id="disqus_thread"></div>
    <script>
    
    var disqus_config = function () {
    this.page.url = '[% post.uri %]';
    this.page.identifier = '[% post.guid %]';
    };
    
    (function() {
    var d = document, s = d.createElement('script');
    s.src = 'https://SHORTNAME.disqus.com/embed.js';
    s.setAttribute('data-timestamp', +new Date());
    (d.head || d.body).appendChild(s);
    })();
    </script>
    <noscript>Please enable JavaScript to view the <a href="https://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
    [% END %]
    

Step 4: Republish your site

Run plerdall. Crossing your fingers while doing so is optional.