Juitter is an interesting jQuery plugin to put Twitter live on your website

[cooldude]

google_protectAndRun("ads_core.google_render_ad", google_handleError, google_render_ad);Juitter is an
interesting jQuery plugin to put Twitter live on your website. Juitter
is lightweight, fast, in real-time, fully customizable and doesn’t slow
down your page while tweets are loading.




In this article I want to illustrate how you can use Juitter to
implement a powerfull Twitter reactions badge that displays in real
time the reactions of Twitter users to your posts. The only thing you
have to do is to download Juitter Beta (the package includes two JavaScript files: jquery.juitter.js and system.js) and include them in the tag of your page after the link to jQuery:


Then you have to add the following layer where you want reactions appear.


Customizing search results


Customizing search results is very simple. First of all you have to
define a search key. I used the title of posts for that, making some
changes to the system.js original source code. Open system.js and modify the first lines of the code:$(document).ready(function() {
$.Juitter.start({

whit the following ones:$(document).ready(function() {
var mysearch = $(".post h1").html();
$.Juitter.start({

and set searchObject with the value of mysearch in this way:searchObject:mysearch,

In the previous code I simply added a new var mysearch that gets the title of the post using a jQuery selector. Important: I’m assuming that the title of posts is wrapped by the tag and the container, within which the title is, has the class property set to .post. You have to change the selector $(".post h1") coherently with the structure of your pages.
Change the parameter total:/code> with the number of tweet to be show and change the number after live:live-
with a number that indicates the time in seconds to wait before request
the Twitter API for real time updates. You can also customize a lot of
other parameters following the instructions on the system.js file.
[b]Customizing the look of the badge


Each tweet is contained within a <li> tag with the class property set to .twittLI.
So, if you want to customize the look of the badge that display search
results the only thing you have to do is to add a simple class .twittLI to your CSS file. Here is an example:.twittLI{
border-bottom:solid 1px #DFDFDF;
clear:both;
padding:4px;
}

Direct Link: http://juitter.com/</li>[/b]