Add Recent Comments Widget with Avatars To Blogger

In one of my past instructional exercises, I officially shared to you the current remarks gadgets for Blogger that can demonstrate the most recent distributed remarks from your posts. Nonetheless, the primary weakness of that gadget is the straightforwardness of the plan and I didn't have a possibility for showing the clients symbols or logo.The symbols are their profile picture in Google in addition to that will demonstrate when they drop a remark in one of your posts. So for those bloggers who need to include symbols, here's the slick late remarks gadget having round symbols and remark selections. The gadget has an additional choice for your innovativeness, you can now change the defaultimage of the mysterious symbols, how pleasant is it? 


As I generally said that each gadget that has a connection to your articles will give you a shot for more site hits. Try not to stress this gadget is SEO agreeable and it can enhance your SEO as a result of the inner backlinks. So you don't have a reason now why you ought not utilize this device in your sidebar. Take after painstakingly my guidelines beneath on how you can include this wonderful late remark in your own blog.

Steps on How to Add Recent Comments  Widget with Avatars

Step 1: Log in to your Blogger Dashboard > Go to LAYOUT and click the ADD A GADGET.

Step 2: In the pop-up window select the HTML/JavaScript option.

Step 3: Select then Copy the code below and Paste it inside the CONTENT big box. In the Titlebox type "Recent Comments" or whatever the title you want.

 <style type="text/css">
ul.whowantstuffscomments{list-style: none;margin: 0;padding: 0;}
.whowantstuffscomments li {background: none !important;margin: 0 0 6px !important;padding: 0 0 6px 0 !important;display: block;clear: both;overflow: hidden;list-style: none;word-break:break-all;}
.whowantstuffscomments li .avatarImage {padding: 3px;
background: #fefefe;-webkit-box-shadow: 0 1px 1px #ccc;-moz-box-shadow: 0 1px 1px #ccc;box-shadow: 0 1px 1px #ccc;float: left;margin: 0 6px 0 0;position: relative;overflow: hidden;}
.avatarRound {-webkit-border-radius: 100px;-moz-border-radius: 100px;border-radius: 100px;}
.whowantstuffscomments li img {padding: 0px;position: relative;overflow: hidden;display: block;}
.whowantstuffscomments li span {margin-top: 4px;color: #666;display: block;font-size: 12px;font-style: italic;line-height: 1.4;}
</style>
<script type="text/javascript">
//<![CDATA[
    // Recent Comments Settings
    var
 numComments  = 5,
 showAvatar  = true,
 avatarSize  = 60,
 roundAvatar = true,
 characters  = 40,
 showMorelink = false,
 moreLinktext = "More »",
 defaultAvatar  = "https://eea15f262f21e893b19e080c6fa6af37ca391d55.googledrive.com/host/0ByaqxhW3zoi_RWk1UW8xanNFYjA",
 hideCredits = true;
//]]>
</script>
<script type="text/javascript" src="https://36e1445ac4b65e272cdb61ffba2e5373c3c503cb.googledrive.com/host/0ByaqxhW3zoi_aXlrb29NVlYwODg">
</script>
<script type="text/javascript" src="/feeds/comments/default?alt=json&callback=whowantstuffscomments&max-results=5">
</script><div style="font-size: 10px; float: right; margin-top: -15px">Get this <a href="http://whowantstuffs.blogspot.com/2015/11/add-recent-comments-widget-with-avatars-blogger.html" rel="nofollow" >Recent Comments Widget</a></div>

Widget Customization

• If you want more comments replace the "5" from [numComments  = 5, and &max-results=5] Remember that there are two value that you need to replace.
• font-size: 12px;font-style: italic; >> 12 is the comment font size, remove the "font-style: italic;" line if you don't want the comment snippets to be italic.
• If you want to change the size of the avatar, Replace the "60" from [avatarSize  = 60,]
• If you want to have an Square avatars remove the line that has a red color OR you can also change the "true" to "false" from [roundAvatar = true,]
• To add more character in comment snippets change the "40," from [characters = 40,]
• To change the avatars of anonymous users, replace the code with color bluebelow with the URL of your ownimage. https://eea15f262f21e893b19e080c6fa6af37ca391d55.googledrive.com/host/0ByaqxhW3zoi_RWk1UW8xanNFYjA. Example: https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTr-Mcg_k05JWCUtUTKQstogmsGqk8lrK3eTPOlB_bmjP9U7hpCsPEqE9iV_6OzpmOpN7pGqobTIVG9a_UeYsveO0BY-xmYgNxZs2847v-9lmfQukm2x0xgrTCcqgG3oUdtE_PK5PeZxKh/s1600/Add-Recent-Comments-Widget-with-Avatars-To-Blogger.jpg

Final Words!

Once the gadgets at last introduced in your blog's sidebar your peruser will see that alternate guests are dynamic in remarking at your articles and that will empower him/her to post a remark in your blog. That is the advantages of utilizing the current remark gadget in blogger. In the event that you confront any issue while including the gadget, you can ask me at the remark area and I will do my best to help you. That is all folks thank you to such an extent!