Hello everyone,Today in this article we are going to explain How to Add Disqus Comments Widget Box in Blogger Template.In previous post we have already talked about Installing Disqus comment load on click and Blogger most commented posts/article gadget.we know that Disqus is the most popular Commenting system for any blog or website.Disqus Offers very professional features like,Moderation of comments(Approve or Delete), Spam filtering, Ban Users for over use of spamming etc.However spam filtering is the best feature from Disqus because you never need to think about that someone is posting irrelevant links in your comments.Whenever anyone drops the comments with the links it's automatically goes to spam after that it will publish only if the admin wants.So that's the reason everyone is loving disqus commenting platform for their websites.
We are going to tell you today how to create disqus comments box in blogspot theme ,lot's of blogs using this feature to display the comments on the trending articles of your blog.However accept it or not somehow it will also helps you to increase the page views ,if your reader view the comments on the specific topic s/he wants to read there is probability that s/he will also join in addition to share their view result you will surely increase the page ranking because disqus comments are SEO friendly all the search engine index disqus comments so if you getting more comments your link will be preferred to display on google search result page.In this disqus comments widget if someone will comment on your post will display and also if mod or admin replied to those comments that will also visible to your visitors.So to grab this disqus comments plugin tool for blogger template follow the steps mentioned below.
How To Add Disqus comments widget box in blogger template
Installation Steps:
Step 1. Log in to your Blogger account and Go to your Blogger Dashboard.
Step 2. Now Go to your Layout->Add a Gadget->Select->HTML/JAVASCRIPT box and copy the below code snippet and paste in the gadget.
<style scoped="scoped" type="text/css">Customization:
#Disqus-RecentComments-bsd{display:block;width:100%;margin:0 auto;padding:0;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;height:410px;}
#Disqus-RecentComments-bsd ul.dsq-widget-list{text-align:left;max-height:410px;overflow:auto;}
#Disqus-RecentComments-bsd img.dsq-widget-avatar{margin:3px 10px 7px 0;width:32px;height:32px;padding:0;float:left;border-radius:3px;clear:both;display:block}
#Disqus-RecentComments-bsd p.dsq-widget-meta{clear:both;font-size:80%;margin-top:5px;font-weight:400}
#Disqus-RecentComments-bsd p.dsq-widget-meta a{display:inline-block;width:48%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#006B6B}
#Disqus-RecentComments-bsd p.dsq-widget-meta a:hover{color:#ff4400}
#Disqus-RecentComments-bsd li.dsq-widget-item{margin:0;padding:6px 0 4px;list-style-type:none;clear:both;border-bottom:1px solid #eee;color:#736fb8;font-weight:610}
#Disqus-RecentComments-bsd li.dsq-widget-item:last-child{border-bottom:none}
#Disqus-RecentComments-bsd a.dsq-widget-user {display:table;color:#666;font-weight:610;}
#Disqus-RecentComments-bsd a.dsq-widget-user:hover{color:#009999;}
#Disqus-RecentComments-bsd span.dsq-widget-comment{display:block;clear:both;margin-top:5px;}
#Disqus-RecentComments-bsd .dsq-widget-comment p{display:inline-block;font-size:89%;margin:0;font-weight:410;color:#666}
#Disqus-RecentComments-bsd .dsq-widget-item pre{position:relative;background-color:#FEF9BF;padding-top:0;box-shadow:0 1px 0 rgba(0,0,0,.1);border-radius:0;opacity:.9;transition:all .3s;}
#Disqus-RecentComments-bsd .dsq-widget-item pre:hover {opacity:1}
#Disqus-RecentComments-bsd .dsq-widget-item pre code {color:#444;font-size:82%;}
#Disqus-RecentComments-bsd .disqus-widget-item pre:before{content:'';position:absolute;padding:initial;font-size:initial;text-indent:initial;left:initial;color:initial;top:0;right:0;width:1.3em;height:1.3em;background-color:#FEF9BF}
#Disqus-RecentComments-bsd .disqus-widget-item pre:after{content:'';font-size:initial;padding:0;position:absolute;width:0;height:0;border-style:solid;border-width:0 1.2em 1.2em 0;border-color:transparent #fff transparent transparent}
</style>
<div id="Disqus-RecentComments-bsd" class="disqus-widget">
<script defer="defer" type='text/javascript'>
//<![CDATA[
// Disqus Recent Comments Widget By www.Bloggersstand.com
document.write("<scr" + "ipt type=\"text/javascript\" src=\"https://bloggersstand.disqus.com/recent_comments_widget.js?num_items=18&hide_mods=0&hide_avatars=1&avatar_size=31&excerpt_length=100\"></scr" + "ipt>");
//]]>
</script>
<script type='text/javascript'>
//<![CDATA[
$("#Disqus-RecentComments-bsd a").filter(function(){return this.hostname&&this.hostname!==location.hostname}).attr('rel', 'nofollow').attr('target', '_blank');
//]]>
</script>
</div>
- Replace Bloggersstand with your Disqus profile user name.