Add simple Recent Comment widget Powered by JASON

Add simple Recent Comment widget Powered by JASON

3
data:blog.title
recent comment

Recent comment widget is very useful to display latest comments by Blog readers and author. It is good to see all latest comments in one place rather searching through different post. Those who are focusing on fast loading recent comment widget then this widget is perfect for them. Because in this widget I didn't use any image thumbnail of commentator, as a result this widget will load faster. In addition a simple but beautiful commentator default image has used that makes this simple widget attractive. For installing this JSON recent comment widget please follow the below steps properly.

JSON

Step 1 Log in to your Blogger account and Go to your Blogger Dashboard

Step 2 Go to your Layout tab.

Step 3 Click on "Add a Gadget" then select "HTML/JavaScript" Widget.

Step 4 Now Copy the below code and Paste it in "HTML/JavaScript" Gadget.

 <style>
.JASON-Montobbo
{
width: 98%;
margin-left: 7px;
margin-bottom: 7px;
word-wrap:break-word;
float:none;
}
#comment {
font:normal 100% Tahoma,Verdana,Arial,Sans-Serif;
margin:0px 0px;
padding:10px 10px;
color:#000;
border:4px solid #eeeeee;
-webkit-box-shadow:inset 0px 0px 2px #000;
-moz-box-shadow:inset 0px 0px 2px #000;
box-shadow:inset 0px 0px 2px #000;
}
#comment ul {
margin:0px 0px;
padding:0px 0px;
}
#comment ul li {
border-bottom:2px dashed #eeeeee;
padding:3px 0px;
list-style:none;
}
#comment ul li b a,
#comment ul li b a:link,
#comment ul li b a:visited,
#comment ul li b {
color:#333333;
text-shadow:0 1px 1px rgba(0,0,0,0.4);
}
#comment ul li b:before {
content: url(http://2.bp.blogspot.com/-k1bhjiL3IrA/VNCneGLGXFI/AAAAAAAAJY0/y3TXQSTTIV0/s1600/JSONComment%2Bwww.bloggerspice.com.png);
margin:0px 4px 0px 0px;
display:inline-block;
*display:inline;
vertical-align:middle;
}
</style>
<div class="JASON-Montobbo">
<script type="text/javascript">
var numcomment = 5,
    numcharacter = 150,
    home_page   = "http://bloggerspice.com/";
</script>
<script type='text/javascript'>
//<![CDATA[
/* Blogger Quick JSON Search Result by www.bloggerspice.com*/
function displaycomment(json) {
        document.write('<div id="comment"><ul>');
        var entry, urlcomment, contcomment, showcomment;
        for (var i = 0; i < numcomment; i++) {
                entry = json.feed.entry[i];
        if (i == json.feed.entry.length) break;
                for (var k = 0; k < entry.link.length; k++) {
                        if (entry.link[k].rel == 'alternate') {
                                urlcomment = entry.link[k].href;
                                break
                        }
                }
                urlcomment = urlcomment.replace("#", "#comment-");
                if ("content" in entry) {
                        contcomment = entry.content.$t
                } else if ("summary" in entry) {
                        contcomment = entry.summary.$t
                } else {
                        contcomment = ""
                }

                var re = /<\S[^>]*>/g;
                contcomment = contcomment.replace(re, "");
                if (contcomment.length > numcharacter) {
                        contcomment = contcomment.substring(0, numcharacter) + "...";
                }
                document.write('<li>');
                document.write('<b><a rel="nofollow" href="' + urlcomment + '">' + entry.author[0].name.$t + '</a>: </b>');
                document.write('<span class="cont">' + contcomment + '</span>');
                document.write('</li>');
        }
        document.write('</ul></div>');
}
document.write('<scr' + 'ipt src="' + home_page + '/feeds/comments/default?redirect=false&alt=json-in-script&callback=displaycomment"><\/script>');
//]]>
</script>
</div>

Step 5 Now hit the Save button.

Customization

  • Change digit var numcomment = 5, for the number of comments you want to show.
  • Change digit numcharacter = 150,for the number of character you want to show.
  • Replace home_page   = "http://bloggerspice.com/";  with your Blog URL

Now check your Blog and see the JSON powered recent comment widget which is very light weight to load. Thanks
Add simple Recent Comment widget Powered by JASON
4 Stars stars - "Add simple Recent Comment widget Powered by JASON" Recent comment widget is very useful to display latest comments by Blog readers and author. It...

nice widget tanx vai image show korle beshi valo hoto - www.esobondhu.com

Fast loading ar jonno image option add kori nai.

When you are working on JavaScript, you will see that you need to address internationalization. Let's understand what this means from the front end point of view. Take a look: javascript

Facebook Group Community Disqus Channel Code ConverterHide Code Converter Show EmoticonHide Emoticon

Got questions? Ask ’em below! While we’re here, you might like to give any feedback about this Post, Your comment inspire us to continuous Improvement of This Blog and Contents. Your words are your own, so be nice and helpful if you can. Please, only use your REAL NAME, not your business name or keywords. Using business name or keywords instead of your real name will lead to the comment being deleted. Anonymous commenting is not allowed either. Limit the amount of links submitted in your comment. We accept clean XHTML in comments, but don't overdo it please.

Make sure you tick the Notify Me box below the comment form to be notified of follow up comments and replies. Thank you for commenting

Contact Form

Name

Email *

Message *