Disqus Recent Comments Widget For Blogger
Updated on April 08, 2016
Actually lazy to tamper blog because of an error that occurred in the Edit HTML Blogger, but it feels bored otherwise tamper coding hehehe ...
Finally I tried to modify a widget recent comments to the comments Disqus who seems now already widely used Blogger. I download the script recent Disqus comment to Blogger from MyBloggerTrik.com and modify it a little zoom and adding rel="nofollow" and target="_blank" in its external link automatically with jquery in order to become more seo friendly.
Author: Adhy Suriady
DEMO
In order not to have to go to the Edit HTML template so that no error will actually make headaches hehehe .... At the moment you can directly add widgets recent Disqus comment directly on the gadgetHTML / JavaScript in the Layout. But if Blogger is no error, for its style css advised to be stored in the edit HTML. And this widget I made responsive too. And make sure you have saved the jquery library (any version) to edit HTML blog so script to add rel="nofollow" and target="_blank" on external links her to walk.
Finally I tried to modify a widget recent comments to the comments Disqus who seems now already widely used Blogger. I download the script recent Disqus comment to Blogger from MyBloggerTrik.com and modify it a little zoom and adding rel="nofollow" and target="_blank" in its external link automatically with jquery in order to become more seo friendly.
DEMO
In order not to have to go to the Edit HTML template so that no error will actually make headaches hehehe .... At the moment you can directly add widgets recent Disqus comment directly on the gadgetHTML / JavaScript in the Layout. But if Blogger is no error, for its style css advised to be stored in the edit HTML. And this widget I made responsive too. And make sure you have saved the jquery library (any version) to edit HTML blog so script to add rel="nofollow" and target="_blank" on external links her to walk.
Please add script below the gadget HTML / JavaScript sidebar in Layout.
Change the code kompiajaib by Disqus username of your blog
Number of comments NUM_ITEMS=20
With this will allow you to see and reply to comments coming Disqus.
<style scoped="scoped" type="text/css">
#RecentComments{display:block;width:100%;margin:0 auto;padding:0 10px;border:1px solid #ddd;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;height:500px;overflow:auto}
.dsq-widget ul.dsq-widget-list{padding:0;margin:0;text-align:left}
img.dsq-widget-avatar{margin:3px 10px 7px 0!important;width:58px!important;height:58px!important;padding:0!important;float:left;border-radius:3px!important}
p.dsq-widget-meta{clear:both;font-size:80%;margin-top:5px!important}
p.dsq-widget-meta a{display:inline-block;width:48%;overflow:hidden;text-overflow:ellipsis;-webkit-text-overflow:ellipsis;white-space:nowrap}
li.dsq-widget-item{margin:0!important;padding:6px 0 4px!important;list-style-type:none;clear:both;border-bottom:1px solid #ddd}
li.dsq-widget-item:last-child{border-bottom:none}
a.dsq-widget-user{font-weight:700;display:block!important;margin-bottom:5px}
</style>
<div id="RecentComments" class="dsq-widget">
<script type='text/javascript'>
//<![CDATA[
document.write("<scr" + "ipt type=\"text/javascript\" src=\"https://kompiajaib.disqus.com/recent_comments_widget.js?num_items=20&hide_mods=1&hide_avatars=0&avatar_size=32&excerpt_length=80\"></scr" + "ipt>");
//]]>
</script>
<script type='text/javascript'>
//<![CDATA[
$("#RecentComments a").filter(function(){return this.hostname&&this.hostname!==location.hostname}).attr('rel', 'nofollow').attr('target', '_blank');
//]]>
</script>
</div>
customization
High widget to set the height:500px on css #RecentCommentsChange the code kompiajaib by Disqus username of your blog
Number of comments NUM_ITEMS=20
With this will allow you to see and reply to comments coming Disqus.