-
As predicted the Twitter Lists API is causing a fast frenzy amongst Twitter developers anxious to be first to support the new Lists feature. Just this morning we saw Seesmic Desktop release a new version of their application to support Lists, and now there's news of a brand new widget.
Twitter Lists Widget is a simple widget built by TweetGrid with a big purpose: letting you create a widget to display tweets from your Twitter Lists.
You can grab the standard embed code for a basic version to paste and publish, or masters of Javascript can tweak the code to create a heavily stylized, custom Twitter Lists Widget.
/* widget config */
var jtw_list = '@mashable/mashable'; /* full name of the Twitter List */
To embed a Twitter Lists Widget on your blog or website, here's a quick tutorial. Copy the code below, but replace '@username/listname' with the full list name. So if you wanted to embed our Mashable list, you would replace '@username/listname' with '@mashable/mashable'. The end result is an automatically updating Mashable Twitter Lists Widget with tweets from all of us at Mashable.
/* widget config */
var jtw_list = '@username/listname'; /* full name of the Twitter List */
The rapid acceleration of applications supporting the new Twitter Lists reminds us of the early days on Twitter, when it seemed like there was a new application being released every five seconds. It's hard not to see parallels between today and the initial developer ecosystem that went hand in hand with Twitter's explosive growth.
Update: Twitter's getting into the Lists widget game with its own Twitter List widget as well. While the code is longer, it is more user-friendly to build. Here's an example of the Twitter widget for Mashable:
new TWTR.Widget({
version: 2,
type: 'list',
rpp: 30,
interval: 6000,
title: 'Mashable Team',
subject: 'Mashable',
width: 250,
height: 300,
theme: {
shell: {
background: '#6088d4',
color: '#ffffff'
},
tweets: {
background: '#ffffff',
color: '#444444',
links: '#3aa8c4'
}
},
features: {
scrollbar: true,
loop: false,
live: true,
hashtags: true,
timestamp: true,
avatars: true,
behavior: 'all'
}
}).render().setList('mashable', 'mashable').start();