Add Expandable Recent Comment Widget in Blogger

Spread the love

In previous Blogger post, we have seen Recent comments widget and Recent Comment Widget for Blogger and Add Recent Comments Widget in Blogger with Avatar. But on these previous blogger recent comment widget, you can see the name of the readers and the title of your Blog post. You can see the comment on the recent comment widget. To see the comment, you have to go to the post. That is a little bit disgusting. If you don’t like those systems than you can use this Expandable Blogger widget. That will show you the recent comment (with real comment) with the name of your blog readers and the title of the post. So you don’t need to seek the post to get the comment. You can directly read the recent comment on this widget.

As an example you can watch the Demo blog:

[wpsm_button color=”green” size=”big” link=”http://demoblog-166.blogspot.com/” icon=”none” class=”” rel=”nofollow”]Demo Blog[/wpsm_button]

Add Expandable Recent Comment Widget in Blogger

Steps to Add Expandable Recent Comment Widget in Blogger

To add this recent comment widget on your Blogger Blog then you have to follow those simple steps.

Step 1. First of all, you have to go to Blogger Dashboard. Then go to Layout >>  Add a Gadget.

Note: You recommend you to add this widget at Sidebar-right-1 section.

Add Expandable Recent Comment Widget in Blogger

Step 2. After clicking “Add a Gadget” you will get a pop-up window with some options. From those options just select the HTML/JavaScript option.

Add Expandable Recent Comment Widget in Blogger

Step 3. Now you will get a pop-up window that included with 2 empty boxes.     Just copy and paste this code on Content box(Code) . You couldn’t fill the Title box.

Add Expandable Recent Comment Widget in Blogger

The code has given here:

[wpsm_codebox style=”1″] <style type=”text/css”>.row-div {margin-bottom:10px;}.comment-header {margin:10px 0;}.comment-box{margin:0px;padding:0px;font-size:0.9em;height:330px;overflow:auto;}.comments1{padding:3px;border-left:1px dashed #A6A6A6;color: #888888;font-style: italic;padding:0px 10px 10px 10px;margin-bottom:10px;}
</style>
<div style=”text-align: center” class=”comment-header”><input class=”comment-button” id=”commshowall” type=”button” onclick=”if (this.value == ‘Show all’) { unfold_all(this); this.value=’Hide all’; } else { fold_all(this); this.value=’Show all’; }” value=”Show all” /></div>
<div class=”comment-box”>
<script type=”text/javascript”>
var tgl=false;var title_arr=new Array();var arr=0;var err=”[err]”;var icon_expand=”http://4.bp.blogspot.com/-MxGZTemGwiI/UXqAWpaVj0I/AAAAAAAADTU/-hwcbgEiCEI/s1600/icon-plus.png”;var icon_collapse=”http://1.bp.blogspot.com/-6nL3BgBD6pM/UXqAWZQJIBI/AAAAAAAADTQ/7IjUXA0avYU/s1600/icon-minus+copy.png”;var maxcomments=20;function real_posttitle(postid){for(var i=0;i<title_arr.length;i++){if(title_arr[i][0]==postid)return title_arr[i][1];}
return err;}
function showrecentposts(json){var numposts=999999;for(i=0;i<numposts;i++){var entry=json.feed.entry[i];var postid;var title;if(i==json.feed.entry.length)break;for(var k=0;k<200;k++){if(entry.link[k].rel==’self’){postid=entry.link[k].href;postid=postid.substr(postid.lastIndexOf(“/”)+1,100);}
if(entry.link[k].rel==’alternate’){title=entry.link[k].title;break;}}
title_arr[arr]=postid+”°”+title;title_arr[arr]=title_arr[arr].split(“°”);++arr;}}
function unfold(el){var comid=el.id.substr(8,10);if(el.src==icon_expand){el.src=icon_collapse;document.getElementById(“com_id”+comid).style.display=”block”;}else{el.src=icon_expand;document.getElementById(“com_id”+comid).style.display=”none”;}}
function unfold_all(el){try{for(var i=0;i<maxcomments;i++){document.getElementById(“com_id”+i).style.display=”block”;document.getElementById(“click_id”+i).src=icon_collapse;}}catch(e){;}
el.value=’Show all’;}
function fold_all(el){try{for(var i=0;i<maxcomments;i++){document.getElementById(“com_id”+i).style.display=”none”;document.getElementById(“click_id”+i).src=icon_expand;}}catch(e){;}
el.value=’Hide all’;}
function showrecentcomments(json){var numcomments=999999;var postid;var i=0;for(i=0;i<numcomments;i++){var entry=json.feed.entry[i];var alturl;var anonymous=false;if(i==json.feed.entry.length)break;for(var k=0;k<entry.link.length;k++){if(entry.link[k].rel==’self’){postid=entry.link[k].href.split(“/”);postid=postid[5];}
if(entry.link[k].rel==’alternate’){alturl=entry.link[k].href;break;}}
var postlink=alturl.split(“#”);postlink=postlink[0];var linktext=postlink.split(“/”);linktext=linktext[5];linktext=linktext.split(“.html”);linktext=linktext[0];var profilelink=””;try{profilelink=entry.author[0].uri.$t;}catch(e)
{anonymous=true;};var posttitle=real_posttitle(postid);if(posttitle==err){posttitle=linktext.replace(/-/g,” “);}
var commentdate=entry.published.$t;var cdyear=commentdate.substring(0,4);var cdmonth=commentdate.substring(5,7);var cdday=commentdate.substring(8,10);var ctime=commentdate.substr(11,5);var monthnames=new Array();monthnames[1]=”january”;monthnames[2]=”february”;monthnames[3]=”march”;monthnames[4]=”april”;monthnames[5]=”may”;monthnames[6]=”june”;monthnames[7]=”july”;monthnames[8]=”august”;monthnames[9]=”september”;monthnames[10]=”october”;monthnames[11]=”november”;monthnames[12]=”december”;if(“content”in entry){var comment=entry.content.$t;}
else
if(“summary”in entry){var comment=entry.summary.$t;}else var comment=””;if(i<maxcomments){if(tgl){tgl=false;var cl=”row-a”;}else{tgl=true;var cl=”row-b”;}
document.write(‘<div class=”‘+cl+’ row-div”><img id=”click_id’+i);document.write(‘” style=”cursor:pointer;” onclick=”unfold(this);”‘);document.write(‘src=”‘+icon_expand+'” />&nbsp;’);document.write(‘On ‘+cdday+’ ‘+monthnames[parseInt(cdmonth,10)]+’ ‘+cdyear);document.write(‘, at ‘+ctime+’, ‘);if(anonymous==false){document.write(‘<a href=”‘+profilelink+'”>’+entry.author[0].name.$t+'</a> ‘);}else{document.write(entry.author[0].name.$t+’ ‘);}
document.write(‘commented on <a href=”‘+alturl+'”>’+posttitle+'</a>’);document.write(‘</div>’);document.write(‘<div class=”comments1″ id=”com_id’+i+'” style=”display:none;”>’+comment+'<\/div>’);}}
document.getElementById(“numcom”).innerHTML=i;}
</script><script type=”text/javascript”  src=”http://Bnewtech.com/feeds/posts/default?start-index=1&max-results=999999&alt=json-in-script&callback=showrecentposts”></script><script type=”text/javascript”  src=”http://Bnewtech.com/feeds/comments/default?start-index=1&max-results=999999&alt=json-in-script&callback=showrecentcomments”>
</script></div>[/wpsm_codebox]

Note: Replace the http://Bnewtech.com  with your Blog/Blogspot URL.

Step 4. After placing and customizing the code, then click on “Save” to save this template.

Add Expandable Recent Comment Widget in Blogger

That’s it. Now you will get a recent comment widget on your Blogger slide bar. This recent comment will show you the exact comment of your blog readers including the reader’s name and blog post title.

If you don’t like this widget style or you want a more defiant widget, then those post can help you get the different type of widgets. We have 3 set of recent comment widget. Those are:

Widget 1: Recent Comment Widget for Blogger
Widget 2: Add Recent Comments Widget in Blogger with Avatar

For more Blogger tricks and tweaks subscribe us via email.

If you need any help please comment here or contact us and send your questions and problems.

bnewtech Editorial Staff

Editorial Staff at Bnewtech is a team of reviews and tutorial writing experts led by BTS. Page maintained by BTS.


Spread the love

Leave a Reply

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

This site uses Akismet to reduce spam. Learn how your comment data is processed.