Examples
#1
jQuery(function($){
$(".tweet").tweet({
join_text: "auto",
username: "seaofclouds",
avatar_size: 48,
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",
auto_join_text_url: "we were checking out",
loading_text: "loading tweets..."
});
});
#2 -
jQuery(function($){
$("#query").tweet({
avatar_size: 32,
count: 4,
query: "tweet.seaofclouds.com",
loading_text: "searching twitter..."
});
});
#3 -
jQuery(function($){
$("#userandquery").tweet({
count: 3,
query: "from:seaofclouds http",
loading_text: "searching twitter..."
});
});
#4 - (Note that it's more reliable to display multiple users' tweets by using a list - see below)
jQuery(function($){
$("#fromtwo").tweet({
avatar_size: 32,
count: 4,
username: ["seaofclouds", "laughingsquid"],
loading_text: "searching twitter...",
refresh_interval: 60
});
});
#5 - Displaying tweets from users on the 'team' list of 'twitter':
jQuery(function($){
$("#list").tweet({
avatar_size: 32,
count: 4,
username: "twitter",
list: "team",
loading_text: "loading list..."
});
});
#6 - Displaying the user sanityinc's favorite tweets, and using a handler for tweet's "loaded" event to make links open in a new window:
jQuery(function($){
$("#favorites").tweet({
avatar_size: 32,
count: 3,
username: "sanityinc",
favorites: true,
loading_text: "loading list..."
}).bind("loaded",function(){$(this).find("a").attr("target","_blank");});
});
#7 - Fetch 20 tweets, but filter out @replies, and display only 3:
jQuery(function($){
$("#filter").tweet({
avatar_size: 32,
count: 3,
fetch: 20,
filter: function(t){ return ! /^@\w+/.test(t.tweet_raw_text); },
username: "sanityinc"
});
});
#8 - Customize the layout to eliminate the date stamps and avatars, add an action (aka "web intent") link, and make it open in a popup window:
jQuery(function($){
$("#custom").tweet({
avatar_size: 32,
count: 4,
username: "seaofclouds",
template: "{text} » {retweet_action}"
});
}).bind("loaded", function(){
$(this).find("a.tweet_action").click(function(ev) {
window.open(this.href, "Retweet",
'menubar=0,resizable=0,width=550,height=420,top=200,left=400');
ev.preventDefault();
});
});
#9 - Adding a message when no tweets matching 'bl5Inv11' are found:
jQuery(function($){
$("#empty").tweet({
avatar_size: 32,
count: 4,
query: rnd,
loading_text: "searching twitter..."
}).bind("empty", function() { $(this).append("No matching tweets found"); });
});
10 - use button to page forwards and backwards:
jQuery(function($){ var options = { username: "seaofclouds", page: 1, avatar_size: 32, count: 4, loading_text: "loading ..." }; var widget = $("#paging .widget"), next = $("#paging .next"), prev = $("#paging .prev"); var enable = function(el, yes) { yes ? $(el).removeAttr('disabled') : $(el).attr('disabled', true); }; var stepClick = function(incr) { return function() { options.page = options.page + incr; enable(this, false); widget.tweet(options); }; }; next.bind("checkstate", function() { enable(this, widget.find("li").length == options.count) }).click(stepClick(1)); prev.bind("checkstate", function() { enable(this, options.page > 1) }).click(stepClick(-1)); widget.tweet(options).bind("loaded", function() { next.add(prev).trigger("checkstate"); }); });
8 Powerful Tools To Put Twitter On Your Website