Blogging Tips Useful

How to Display Disqus Recent Comments On Your Blog

Today, Disqus comments plugin is used by most websites and blogs including some popular sites in the world. We also use the same for this blog. Someday I will definitely explain some useful features of Disqus over others.

As all of you know, displaying recent comments on your blog is really very crucial to enhance visitor's engagement and getting more comments, so I decided to write an article about how you can display recent conversations in beautiful way.

About Disqus

Disqus has provided some good API to fetch your blog's recent comments and yes you can definitely use them but it might need a bit of techy knowledge. Besides this Disqus also supports RSS feed which you can even use for this purpose. But, if you are the most easy going person in the world, then you might not take interest in these techniques. For persons like you, Disqus has also provided two lines of JavaScript code which you can integrate with your blog to fulfill your need.

JavaScript code to fetch Disqus Recent comments

This is the default way to display recent comments, not so attractive, just the links and the author thumbnails are shown.

We can't use this directly on our blog. But with a little bit formatting we can definitely enhance its look. It took about half an hour of time to enhance and change its look. Here are the live demos .

Just with simple CSS you can modify the entire layout. To get the code, click on above links and view the source from your browser. If you give little more time they can be even attractive. Here is the list of parameters which you can modify to get results as per your choice.

num_items No. of comments to show in the list. Max alloweed is 25.
hide_avatars You can show or hide the images by setting to 0 or 1 respectively.
excerpt_length Number of characters to display in each comment.

Disqus combo plugin with all features

One more plugin Disqus provides is the all-in-one combo plugin where you will get 3 things at one place. You will get top commenter, recent comments and most discussed in a 3  tabbed structure. Here is the 2 line JavaScript code which you need to add to integrate this in your blog.

Again not so attractive. Need to apply css. Here is a live demo which I did to enhance its look.

You can change following parameters in the script tag to get different results.

num_items No. of comments to show in the list. Max alloweed is 25.
hide_mods Set it to 1 if you want to hide your own comments.
default_tab It takes three values 'people','recent','popular' and accordingly activate the corresponding tab on load.
excerpt_length Number of characters to display in each comment.

For any queries drop a comment 🙂

15 thoughts on “How to Display Disqus Recent Comments On Your Blog”

  1. Much appreciated. Thank you. Any more non-css related customization tricks would be great. I hope someone figures out a way to list comments by post. A wordpress plugin I use does it but it only works with wordpress comments of course. Thanks again.

        1. There is no separate CSS file. You need to overwrite the existing CSS classes. When you load the Disqus comments it has got some CSS classes. So you need to write your own CSS and paste them in your web page so that when the comments will be loaded they will be automatically overwritten by yours.

  2. How you make the button for disqus comments? I see the page not load the comments before i press “comment”… i need this too. Can you write a tutorial how i can load disqus with click`?

Leave a Reply

Your email address will not be published. Required fields are marked *