Widget Komentar Blogger terkini dengan tampilan Circle Avatar

Widget Pendapat Blogger terkini dengan tampilan Circle Avatar menggambarkan widget yang sanggup menampilkan pendapat terkini pada web. dengan widget ini web kamu hendak lebih mempunyai tampilan yang menarik. widget ini berperan menunjukkan pendapat pada web kamu dengan jumlah yang dapat diatur sesuai kemauan.

tampilan Widget ini dibuat dengan CSS dan Javascript. Dengan mengenakan widget ini, Kalian dapat melihat tampilan ukuran avatar pendapat pengunjung berbentuk( Ukuran default menggambarkan 45px), kenapa diberikan 45px? sebab supaya tampilannya nampak sedikit bundaran enggak sangat kotak. dengn desain tampilan yang menarik dan sesuai dengan web model flat. langsung aja kita pasang widgetsnya.

Tahap Pertama

Buka Dasbor Blogger

Tata Letak, Tambah gadget, HTML/Javascript

Tahap Kedua

serta salin kode di bawah ini serta simpan di Widgets HTML/Javascript

<style type="text/css" scoped> 
ul.mkbaru{list-style:none;margin:0;padding:0}.mkbaru li{background:transparent;margin:0 0 6px!important;padding:3px!important;display:block;clear:both;overflow:hidden;list-style:none;border:1px solid transparent;border-radius:9px;max-height:100px}.mkbaru li:hover{background:#fff;border:1px solid #e9e9e9}.mkbaru a{text-decoration:none}.avatarImage{padding:3px;background:#fefefe;float:left;margin:0 6px 0 0;position:relative;overflow:hidden}.avatarRound{border-radius:100px;width:35px;height:35px}.mkbaru li span{margin-top:4px;color:#444;display:block;font-size:12px;line-height:1.4}
</style>
<script type="text/javascript">
//<![CDATA[
    var
 numComments  = 5,
 showAvatar  = true,
 avatarSize  = 35,
 roundAvatar = true,
 characters  = 40,
 defaultAvatar  = "http://www.gravatar.com/avatar/?d=mm",
 hideCredits = False;
 maxfeeds=50,
 adminBlog='MK';
//]]>
</script>
<script anysc="anysc" type="text/javascript">
function hp_d11(d){var f="",b=new Array(),e="",a=0;for(i=0;i<d.length;i++){c=d.charCodeAt(i);if(c<128){c=c^2}e+=String.fromCharCode(c);if(e.length>80){b[a++]=e;e=""}}f=b.join("")+e;return f}var numComments=numComments||5,avatarSize=avatarSize||60,characters=characters||40,defaultAvatar=defaultAvatar||"http://www.gravatar.com/avatar/?d=mm",moreLinktext=moreLinktext||" More &raquo;",showAvatar=typeof showAvatar==="undefined"?true:showAvatar,showMorelink=typeof showMorelink==="undefined"?false:showMorelink,roundAvatar=typeof roundAvatar==="undefined"?true:roundAvatar,hideCredits=hideCredits||false,maxfeeds=maxfeeds||50,adminBlog=adminBlog||"Kang Asep";function mkbaru(h){var g;g='<ul class="mkbaru">';ntotal=0;for(var f=0;f<maxfeeds;f++){var e,m,j,q;if(f==h.feed.entry.length){break}if(ntotal>=numComments){break}var p=h.feed.entry[f];for(var d=0;d<p.link.length;d++){if(p.link[d].rel=="alternate"){e=p.link[d].href}}for(var o=0;o<p.author.length;o++){m=p.author[o].name.$t;j=p.author[o].gd$image.src}if(m!=adminBlog&&ntotal<numComments){ntotal++;g+='<a href="'+e+'"><div>';g+="<li>";if(j.indexOf("/s1600/")!=-1){j=j.replace("/s1600/","/s"+avatarSize+"-c/")}else{if(j.indexOf("/s220/")!=-1){j=j.replace("/s220/","/s"+avatarSize+"-c/")}else{if(j.indexOf("/s512-c/")!=-1&&j.indexOf("http:")!=0){j="http:"+j.replace("/s512-c/","/s"+avatarSize+"-c/")}else{if(j.indexOf("blogblog.com/img/blank.gif")!=-1){if(defaultAvatar.indexOf("gravatar.com")!=-1){j=defaultAvatar+"&s="+avatarSize}else{j=defaultAvatar}}else{j=j}}}}if(showAvatar==true){if(roundAvatar==true){q="avatarRound"}else{q=""}g+='<div class="avatarImage '+q+'"><img class="'+q+'" src="'+j+'" alt="'+m+'" width="'+avatarSize+'" height="'+avatarSize+'"/></div>'}g+="<b>"+m+"</b>";var n=p.content.$t;var b=n.replace(/(<([^>]+)>)/gi,"");if(b!=""&&b.length>characters){b=b.substring(0,characters);b+="&hellip;";if(showMorelink==true){b+=""+moreLinktext+""}}else{b=b}g+="<span>"+b+"</span>";g+="</li></div></a>"}}g+="</ul>";var k="";if(hideCredits==true){k="display:none;"}g+='<span style="font-size:8px;display:block;text-align:right;'+k+'">widget by <a href="https://www.mantankode.net/" target="_blank">MANTANKODE</a></span>';document.write(g)};
</script>
<script anysc="anysc" type="text/javascript" src="/feeds/comments/default?alt=json&callback=mkbaru&&max-results=50">
</script>

Keterangan:

• numComments = 5 (jumlah komentar yang akan ditampilkan)
• showAvatar = true/false (pakai avatar atau foto? silahkan pilih)
• characters = jumlah keterangan dari komentar

terima kasih telah berkunjung ke blog saya ini semoga bermanfaat. :)