Cool Tweet/Twitter Follower Counter Using jQuery

In the current time of social networking social bookmarks have become lifeline of any website that needs to attract traffic ( including webspeaks.in :P). Everyone wants to show the number of subscribers/follwers of  is/her site. This task has been oversimplified by jQuery, where a single line of code can ease your life a lot. In this post I am showing how to display ‘Number of tweets’ and ‘Number of Twitter followers of your
website’. Lets watch how does it work?



Live Demo Download Script

jQuery Code

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(function()
{
url = "http://www.webspeaks.in/2010/07/create-pdf-file-with-php.html";

// Get Number of Tweet Count From TweetMeme
$.getJSON('http://api.tweetmeme.com/url_info.jsonc?url='+url+'&callback=?',
function(data)
{
$('#twit').html(' Tweets : [' + data.story.url_count + ']');
});

// Get Number of Twitter Followers From Twitter.com
twitterusername = 'arvind_bh';
$.getJSON('http://twitter.com/users/'+twitterusername+'.json?callback=?',
function(data)
{
$('#twitflw').html('Twitter Followers : [' + data.followers_count + ']');
});
})
</script>

HTML Code

<html>
<head>
<style>
a { color:#C0C; font-size:18px; font-weight:bold; font-family:Verdana, Geneva, sans-serif; text-decoration:none; }
</style>
</head>
<body>
<div style="border:2px solid #C0C; margin:20px;">
URL : <a href="http://www.webspeaks.in/2010/07/create-pdf-file-with-php.html">
http://www.webspeaks.in/2010/07/create-pdf-file-with-php.html</a><br/><br />
<ul>
<li><a href="http://twitter.com/" id="twit"></a></li>
<li><a href="http://twitter.com/arvind_bh" id="twitflw"></a></li>
</ul>
</div>
</body>
</html>

Written by Arvind Bhardwaj

Arvind is a certified Magento 2 expert with more than 10 years of industry-wide experience.

Website: http://www.webspeaks.in/