New Twitter Widget

Published: November 20, 2012

In October 2012 Twitter changed the way you can embed a Twitter feed widget on your website. So the widgets you had on your websites might not load new tweets or it simply give error messages. To overcome this problem you can go ahead and log in to Twitter to create and manage widgets there (https://twitter.com/settings/widgets) but I personally prefer the way I'm going to present in this article. Below you can find the code you can use and implement a nice feed.

The good news is that it's not an iframe so you can easily apply your own styles. Modify the setUser property to the Twitter username you want to display. Then set width, height, the colors and other styles for tweets etc. The rpp attribute shows how many tweets you want to display.

Find below the code to embed the new Twitter Widget.

Update June 2013

Apparently twitter has changed it's widget again and the one presented here is not working anymore. You better delete your widget from your webpage or hire someone who changes it twice every year. Go to the Twitter site to generate a new embed code, it takes about 5 minutes and it's simple. The result will look like the one in the footer of this page if you're browsing on a desktop.

<script charset="utf-8" src="http://widgets.twimg.com/j/2/widget.js">
</script>
<script>
new TWTR.Widget({
version: 2,
type: 'profile',
rpp: 4,
interval: 30000,
width: '320',
height: '250',
theme: {
shell: {
background: '#111111',
color: '#ffffff'
},
tweets: {
background: '#111111',
color: '#999999',
links: '#FFFFFF'
}
},
features: {
scrollbar: false,
loop: false,
live: false,
behavior: 'all'
}
}).render().setUser('RuwixCube').start();
</script>

Comments