by Abhijit Gaikwad
Have you ever wondered how to create Twitter widgets?
Today I will walk you through simple steps to create a Twitter widgets using JASON, JQEURY, php.
First of you will have to select a twitter API. You can choose an API from http://apiwiki.twitter.com/Twitter-API-Documentation. For instance I will use Twitter Trends API.
Now create an php class to read this twitter API. Remeber that this API returns you the JASON object.
Lets create a read_trends.php file as following
<?php
$request = curl_init();
curl_setopt( $request, CURLOPT_URL, ‘http://search.twitter.com/trends.json’ );
curl_setopt( $request, CURLOPT_RETURNTRANSFER, 1 );
curl_setopt( $request, CURLOPT_HEADER, 0 );
$response = curl_exec( $request );
curl_close( $request );
echo ( $response );
?>
For this I will use jQuery to read JASON object. Since we are using jQeury to read JASON object, do not forget to add
<script src=”http://code.jquery.com/jquery-latest.js” type=”text/javascript”>
Now we can read this JASON object and show it in table.
<table id=”trends” BORDER=2 RULES=NONE FRAME=BOX bgcolor=#eeeeee><thead><th style=”color:#800000;”><b>Current Twitter Trends</b></th></thead>
<tbody></tbody>
</table>
<script>
$(document).ready(function(){$(”#trends tbody”).html(”");
$.getJSON(
“read_trends.php”,
function(data){
$.each(data.trends, function(i,user){
var tblRow =
“<tr>”
+”<td><a href=’”+user.url+”‘ target=’_blank’>”+user.name+”</a></td>”
+”</tr>”
$(tblRow).appendTo(”#trends tbody”);
});
}
);
});
$(”#loadtrends”).click(function(){
});
$(’#trends tbody tr’).alternate({hover:true},function(){$(this).toggleClass(’selected’)});
</script>
Thats it we are all set.
Check working version here