Place twitter on your site : Jquery
Jquery makes developer work easy and simple. Ok! Lets see how can we put twitter on our sites using jquery widget.
We have to do nothing other than initializing the twitter account.
Lets try in a simple HTML.
1. Create a "Twitter_Saalram.html"
2.Download the twitter widget pack.
3. Unzip and find "jquery.tweet.js." and "jQuery.js".
4. Now include these supporting library files on your HTML template. I mean place
"<script language="javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js" type="text/javascript"></script>
<script language="javascript" src="/tweet/jquery.tweet.js" type="text/javascript"></script> " code inside <head> tag.
5. "<script type='text/javascript'>
$(document).ready(function(){
$(".tweet").tweet({
username: "saalram",
join_text: "auto",
avatar_size: 32,
count: 3,
auto_join_text_default: "we said,",
auto_join_text_ed: "we",
auto_join_text_ing: "we were",
auto_join_text_reply: "we replied to",
auto_join_text_url: "we were checking out",
loading_text: "loading tweets..."
});
});
</script> "
initialize your twitter account using the above snippet and that also should be placed in <head> tag.
6. So here we initialized twitter account and it is ready to show saalram's tweets on "Twitter_Saalram.html" page.
7. As per the above steps, Jquery will get saalram's tweets but where will it display on "Twitter_Saalram.html"? so we have to mention placeholder for saalram's tweets on our "Twitter_Saalram.html" like this in <body> part
"<div class="tweet"></div> "
8. Style with our stylesheet in <head>, or modify as you like!
<link href="jquery.tweet.css" media="all" rel="stylesheet" type="text/css"/>
9. Licensed under the MIT
10. Read more ...
======================
Publicize Yourself... Free!
http://saalram.com
======================
Jan 31, 2010
Subscribe to:
Post Comments (Atom)
No comments:
Post a Comment
Saalram.com