Today I was having a bit of fun. And I wanted to add the number of followers we have for our LessThanDot Twitter account.

I could have used the numerous services that give this feature already like twittercounter. Which I did on the statistics page.

But those things are just copy paste and I wanted to show the number of followers in the title/tooltip for the twitter button in the social sitings sidebar section (Yes, Eli it now has a name).

After some googling I found jTwitter. And I downloaded version 1.1.0.

It just is a very small wrapper around the Twitter API and it returns the json document that the api uses. It is very easy to use, once you know how ;-).

After adding the jtwitter file as a dependency, like so:

xml <script type="text/javascript" src="jquery.jtwitter.js"></script> We can add this piece of script somewhere and see the magic happen:

javascript $(document).ready(function(){$.jTwitter('LessThanDot',1, function(userdata){ $('#social_twitter').attr({title: "Follow us on Twitter. Like " + userdata[0].user.followers_count + " others."});});}); But you can do so much more with this.

Just look at what a twitter json object gives you:

/*

Example of returned object

*/

[

{

‘in_reply_to_user_id’:null,

‘in_reply_to_screen_name’:null,

‘source’:’web’,

‘created_at’:’Fri Sep 18 06:11:15 +0000 2009′,

‘truncated’:false,

‘user’:{

‘profile_background_color’:’9ae4e8′,

‘description’:’jQuery and JavaScript howtos, tutorials, hacks, tips and performanace tests. Ask your jQuery questions here…’,

‘notifications’:false,

‘time_zone’:’Central Time (US & Canada)’,

‘url’:’http://jquery-howto.blogspot.com’,

‘screen_name’:’jQueryHowto’,

‘following’:true,

‘profile_sidebar_fill_color’:’e0ff92′,

‘created_at’:’Thu Mar 26 14:58:19 +0000 2009′,

‘profile_sidebar_border_color’:’87bc44′,

‘followers_count’:2042,

‘statuses_count’:505,

‘friends_count’:1015,

‘profile_text_color’:’000000′,

‘protected’:false,

‘profile_background_image_url’:’http://s.twimg.com/a/1253209888/images/themes/theme1/bg.png’,

‘location’:”,

‘name’:’jQuery HowTo’,

‘favourites_count’:15,

‘profile_link_color’:’0000ff’,

‘id’:26767000,

‘verified’:false,

‘profile_background_tile’:false,

‘utc_offset’:-21600,

‘profile_image_url’:’http://a3.twimg.com/profile_images/110763033/jquery_normal.gif’

},

‘in_reply_to_status_id’:null,

‘id’:4073301536,

‘favorited’:false,

‘text’:’Host jQuery on Microsoft CDN servers http://retwt.me/2N3P’

},

{

‘in_reply_to_user_id’:null,

‘in_reply_to_screen_name’:null,

‘source’:’HootSuite‘,

‘created_at’:’Thu Sep 17 17:20:21 +0000 2009′,

‘truncated’:false,

‘user’:{

‘profile_sidebar_fill_color’:’e0ff92′,

‘description’:’jQuery and JavaScript howtos, tutorials, hacks, tips and performanace tests. Ask your jQuery questions here…’,

‘friends_count’:1015,

‘url’:’http://jquery-howto.blogspot.com’,

‘screen_name’:’jQueryHowto’,

‘following’:false,

‘profile_sidebar_border_color’:’87bc44′,

‘favourites_count’:15,

‘created_at’:’Thu Mar 26 14:58:19 +0000 2009′,

‘profile_text_color’:’000000′,

‘profile_background_image_url’:’http://s.twimg.com/a/1253141863/images/themes/theme1/bg.png’,

‘profile_link_color’:’0000ff’,

‘protected’:false,

‘verified’:false,

‘statuses_count’:504,

‘profile_background_tile’:false,

‘location’:”,

‘name’:’jQuery HowTo’,

‘profile_background_color’:’9ae4e8′,

‘id’:26767000,

‘notifications’:false,

‘time_zone’:’Central Time (US & Canada)’,

‘utc_offset’:-21600,

‘followers_count’:2038,

‘profile_image_url’:’http://a3.twimg.com/profile_images/110763033/jquery_normal.gif’

},

‘in_reply_to_status_id’:null,

‘id’:4058535256,

‘favorited’:false,

‘text’:’jQuery Tip: Don’t forget that you can load jQuery UI files from Google servers as well http://bit.ly/fJs2r’

},

{

‘in_reply_to_user_id’:null,

‘in_reply_to_screen_name’:null,

‘source’:’web’,

‘created_at’:’Thu Sep 17 05:44:30 +0000 2009′,

‘truncated’:false,

‘user’:{

‘profile_sidebar_fill_color’:’e0ff92′,

‘description’:’jQuery and JavaScript howtos, tutorials, hacks, tips and performanace tests. Ask your jQuery questions here…’,

‘friends_count’:1015,

‘url’:’http://jquery-howto.blogspot.com’,

‘screen_name’:’jQueryHowto’,

‘following’:true,

‘profile_sidebar_border_color’:’87bc44′,

‘favourites_count’:15,

‘created_at’:’Thu Mar 26 14:58:19 +0000 2009′,

‘profile_text_color’:’000000′,

‘profile_background_image_url’:’http://s.twimg.com/a/1253048135/images/themes/theme1/bg.png’,

‘profile_link_color’:’0000ff’,’protected’:false,

‘verified’:false,

‘statuses_count’:503,

‘profile_background_tile’:false,

‘location’:”,

‘name’:’jQuery HowTo’,

‘profile_background_color’:’9ae4e8′,

‘id’:26767000,

‘notifications’:false,

‘time_zone’:’Central Time (US & Canada)’,

‘utc_offset’:-21600,

‘followers_count’:2035,

‘profile_image_url’:’http://a3.twimg.com/profile_images/110763033/jquery_normal.gif’

},

‘in_reply_to_status_id’:null,

‘id’:4048429737,

‘favorited’:false,

‘text’:’Added a demo page for my ‘How to bind events to AJAX loaded elements’ blog post as requested by users http://bit.ly/q2tWe’

}

]

So I guess you can think of plenty of ways to use this.