Adding a recent comment widget to Blogger blog

bySetyo Wibowo ID - 0

 Adding a recent comment widget to Blogger blog

Most third-party Blogger themes have support for adding a recent comment widget. But in some cases, your theme developer might have not included this feature and you may be in need of it.

Today, we will share with you a simple code for adding a recent comment to a Blogger blog/website. And the good thing about this widget code is that you can add to your Blogger blog without having to modify any code.

Also, the comment widget is light-weight and won't impair on your site's performance. 

Adding a recent comment widget to your Blogger site might be just another way of encouraging user engagement, especially when they will get to see comments from articles that are trending and attracting other user's attention.

Features of the Blogger recent comment widget

  • Easy to add and customise
  • Displays name of the person commenting
  • Comment excerpt

Adding the widget

To add this widget code to your Blogger Blog is very simple. Here are the steps to follow;
  • Log in to Your Blogger account.
  • From the dashboard, head to"Layout"
  • Under the layout section,  add a new HTML/JavaScript gadget and name it "Recent comments".
  • Now copy the recent widget code from below and paste it inside the HTML/Javascript gadget
  • Save and there you go.
Recent comment widget code


<style type="text/css">
/*
Widget: Simple Recent Comment Widget for Blogger - Version 1.1
Author: Tien Nguyen
URL: http://sneeit.com/simple-recent-comment-widget-blogger/
*/
a.sneeit-srcbw {
	/*item-color*/color: #000000;/*item-color*/
	/*border-color*/border-top: 1px solid #dddddd;/*border-color*/
	display: block;
	padding: 1em 1.5em;
	position: relative;
}
.sneeit-srcbw-icon-comment {
    position: absolute;
    left: 0;
	top: 1.1em;
}
.sneeit-srcbw-icon-arrow {
	/* arrow-icon-color*/color: #ff4400;/* arrow-icon-color*/
    position: absolute;
    right: 0;
    font-size: 200%;
    top: 50%;
    margin-top: -0.55em;
}
.sneeit-srcbw-credit {
	font-size: 90%;
	text-align: right;
	padding: 1em 0;
	/*credit*/display: block;/*credit*/
	/*border-color*/border-top: 1px solid #dddddd;/*border-color*/
}
#sneeit-srcbw-exclude {
	display: none!important;
}
html[dir="rtl"] .sneeit-srcbw-icon-comment {
	right:0;
	left: auto;
}
html[dir="rtl"] .sneeit-srcbw-icon-arrow{
	left:0;
	right: auto;
}
html[dir="rtl"] .sneeit-srcbw-credit {
	text-align: left;
}
</style>
<noscript id="sneeit-srcbw-exclude"></noscript>
<script type="text/javascript">
// settings
var sneeit_srcbw_count = 5; // change the number of comments
var sneeit_srcbw_summary_length = 50; // summary length
var sneeit_srcbw_icon_comment = 'fa-comment-o'; // comment icon
var sneeit_srcbw_icon_arrow = 'fa-angle-right'; // arrow icon
_s7GpE = ['link','href','font-awesome','link','text/css','stylesheet','https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css','sneeit-srcbw-exclude','\n','string','undefined','feed','entry','Not found any comment',' ...','','','alternate','self','#','/','#c','<a class="sneeit-srcbw" href="','"><i class="sneeit-srcbw-icon-comment fa ','"></i><span><strong>',':</strong> ','</span><i class="sneeit-srcbw-icon-arrow fa ','"></i></a>','<span class="sneeit-srcbw-credit">Powered by <a href="http://sneeit.com/simple-recent-comment-widget-blogger/" target="_blank">Sneeit</a></span>','<script type="text/javascript" src="/feeds/comments/summary?alt=json-in-script&max-results=','&callback=_fCiE"><\/script>'];var _vHpF=document.getElementsByTagName(_s7GpE[0]);for(var _vLbB=0;_vLbB<_vHpF.length;_vLbB++){if(_s7GpE[1] in _vHpF[_vLbB]&&_vHpF[_vLbB].href.indexOf(_s7GpE[2])!=-1){break;}}if(_vLbB>=_vHpF.length){var _vLbJ=document.createElement(_s7GpE[3]);_vLbJ.type=_s7GpE[4];_vLbJ.rel=_s7GpE[5];_vLbJ.href=_s7GpE[6];document.head.appendChild(_vLbJ);}var _vRqN=document.getElementById(_s7GpE[7]).innerHTML;var _vSbX=sneeit_srcbw_count;_vRqN=_vRqN.trim();if(_vRqN){_vRqN=_vRqN.split(_s7GpE[8]);_vSbX=_vSbX*(_vRqN.length+2);}function _fCiE(json){if(typeof(json)==_s7GpE[9]||typeof(json)==_s7GpE[10]||!(_s7GpE[11] in json)||!(_s7GpE[12] in json.feed)||!json.feed.entry.length){document.write(_s7GpE[13]);return;}var _vQbX=0;for(var _vLbB=0;_vLbB<json.feed.entry.length&&_vQbX<sneeit_srcbw_count;_vLbB++){var _vOlU=json.feed.entry[_vLbB];var _vQjW=_vOlU.author[0].name.$t;var _vRcD=_vOlU.summary.$t;if(_vRqN.indexOf(_vQjW)!=-1){continue;}_vQbX++;if(_vRcD.length>sneeit_srcbw_summary_length){_vRcD=_vRcD.substring(0,sneeit_srcbw_summary_length)+_s7GpE[14];}var _vVgK=_s7GpE[15];var _vVeS=_s7GpE[16];for(var _vIlN=0;_vIlN<_vOlU.link.length;_vIlN++){var _vLbJ=_vOlU.link[_vIlN];if(_s7GpE[17]==_vLbJ.rel){_vVgK=_vLbJ.href;}else if(_s7GpE[18]==_vLbJ.rel){_vVeS=_vLbJ.href;}}if(!_vVgK){continue;}if(_vVgK.indexOf(_s7GpE[19])==-1){_vVeS=_vVeS.split(_s7GpE[20]);_vVeS=_vVeS[_vVeS.length-1];_vVgK+=(_s7GpE[21]+_vVeS);}document.write(_s7GpE[22]+_vVgK+_s7GpE[23]+sneeit_srcbw_icon_comment+_s7GpE[24]+_vQjW+_s7GpE[25]+_vRcD+_s7GpE[26]+sneeit_srcbw_icon_arrow+_s7GpE[27]);}document.write(_s7GpE[28]);}document.write(_s7GpE[29]+_vSbX+_s7GpE[30]);
</script>

Disclaimer: Blogger Customiz is not the owner of the code. We simply share to help those who are in need. 
Tags:

Post a Comment (0)

أحدث أقدم