Install Recent Comments Widget on Blogger 2019 - 100% Working Method

Recent Comments A widget is a widget whose way it works is to display a list of the latest comments that enter the blog. This widget is quite useful for those of you who want to display the latest comments on their blog and also you no longer need to bother checking the latest comments on the Blogger dashboard because comments will appear on the blog directly.

How to Install Recent Comments Widget on Blogger

In addition, by installing this widget. Will provide an attraction for visitors to see the subject of what blog visitors often ask.


Okay, without lingering, let's look at tips on How to Install Recent Comments Widget on Blogger below.


Here I will give 2 style options Recent Comments Widget. 👇


✓ Open Blogger >>
Themes> >
Click the Edit HTML button >>
and add the following code above the code
            </ head>

Flexible Recent Comment Widget for Blogger 

<style type='text/css'>
#gd_comments{padding:0;margin:0;max-height:320px;overflow-x:hidden;overflow-y:scroll}
#gd_comments li{padding:10px 0;font-size:14px}
#gd_comments li a.recencmtitle{color:#222;display:block;margin:0 auto 10px auto;font-weight:700}
#gd_comments li .recencmbody{background:#fdf1ca;color:#000;display:block;padding:10px;margin:0 5px 0 0;border-radius:5px;line-height:normal;box-shadow:0 2px 0 rgba(0,0,0,0.1);}
#gd_comments li:nth-child(odd) .recencmbody{background:#def7fd}
</style>
<script type='text/javascript'>
//Recent Comments Settings
var numComments  = 15;
var characters  = 80;
</script>
<script type='text/javascript'>
//<![CDATA[
//Recent Comments
var numComments=numComments||15,characters=characters||80;function gd_comments(tb){var commentsHtml;commentsHtml='<ul id="gd_comments">';for(var i=0;i<numComments;i++){var commentlink,authorName;if(i==tb.feed.entry.length)break;commentsHtml+="<li>";var entry=tb.feed.entry[i];for(var l=0;l<entry.link.length;l++){if(entry.link[l].rel=='alternate'){commentlink=entry.link[l].href}}for(var a=0;a<entry.author.length;a++){authorName=entry.author[a].name.$t}commentsHtml+="<a class='recencmtitle' href=\""+commentlink+"\" title=\""+authorName+"\">"+authorName+"</a>";var commHTML=entry.content.$t;var commBody=commHTML.replace(/(<([^>]+)>)/ig,"");if(commBody!=""&&commBody.length>characters){commBody=commBody.substring(0,characters);commBody+=" &hellip;"}else{commBody=commBody}commentsHtml+=" ";commentsHtml+="<span class='recencmbody'>"+commBody+"</span>";commentsHtml+="</li>"}commentsHtml+='</ul>';document.write(commentsHtml)}
//]]>
</script>

Stylish Recent Comments Widget with Avatar (Thumbnails) for Blogger 

<style type='text/css'>
#gd_comments{padding:0;margin:0;max-height:320px;overflow-x:hidden;overflow-y:scroll}
#gd_comments li .recencmbody{color:#222;padding:0;margin:0 5px 0 0;line-height:normal}
#gd_comments li a.recencmtitle{color:#222;display:block;margin:0 auto 10px auto;font-weight:bold}
#gd_comments li{font-size:14px;list-style:none;padding:0 0 15px 15px;position:relative;border-left:1px solid rgba(0,0,0,0.1);margin:0;margin-left:6px}
#gd_comments li:before{content:"";background:#f39c12;height:12px;width:12px;display:block;border:2px solid #fff;border-radius:100%;float:left;position:absolute;top:6px;left:-6px}
</style>
<script type='text/javascript'>
//Recent Comments Settings
var numComments  = 15;
var characters  = 80;
</script>
<script type='text/javascript'>
//<![CDATA[
//Recent Comments
var numComments=numComments||15,characters=characters||80;function gd_comments(tb){var commentsHtml;commentsHtml='<ul id="gd_comments">';for(var i=0;i<numComments;i++){var commentlink,authorName;if(i==tb.feed.entry.length)break;commentsHtml+="<li>";var entry=tb.feed.entry[i];for(var l=0;l<entry.link.length;l++){if(entry.link[l].rel=='alternate'){commentlink=entry.link[l].href}}for(var a=0;a<entry.author.length;a++){authorName=entry.author[a].name.$t}commentsHtml+="<a class='recencmtitle' href=\""+commentlink+"\" title=\""+authorName+"\">"+authorName+"</a>";var commHTML=entry.content.$t;var commBody=commHTML.replace(/(<([^>]+)>)/ig,"");if(commBody!=""&&commBody.length>characters){commBody=commBody.substring(0,characters);commBody+=" &hellip;"}else{commBody=commBody}commentsHtml+=" ";commentsHtml+="<span class='recencmbody'>"+commBody+"</span>";commentsHtml+="</li>"}commentsHtml+='</ul>';document.write(commentsHtml)}
//]]>
</script>

Only Choose One Style Css - Mind It Bloggers

How Add Recent Comments Widget To Bloggers Blogs 

✍️ After that click the Save theme button. Next add this code in the new widget in Layout option . Follow Instructions :✍️

✓ visit blogger.com

✓ Click the Layout option >> Add a Gadget >> Html/JavaScript > > Copy below code and Paste in It. Finally save The Widget ...

<script type='text/javascript'>
document.write("<script src=\"/feeds/comments/default?alt=json&callback=gd_comments\"><\/script>");
</script>

😉 " THAT'S ALL 😉

For more information please Watch This Video 👇




Friends, how did we get this post? Please tell us by commenting. And if you get the benefit, please share it in the social media. So that everyone can benefit from it. And subscribe to my website too. So keep getting the latest post updates....