Roland Weigelt

Including Twitter Updates in Your Website/Weblog

Twitter, the service that finally starts making some kind of sense to me, offers various ways of including updates in your own website/weblog. After experimenting with the AJAX version directly on my weblog, I switched to using a separate HTML page shown in an IFRAME tag instead. The result can be seen on this page, it's on the left side under the tag cloud, in the "News" box.

Just in case somebody else may find this useful, here's a short HOWTO:

• Download the files twitterUpdates.htm and twitterBullet.gif by right-clicking the links and choosing "Save link as" (or "Save target as", depending on your browser)
• Inside the HTML file, replace the text YourUserName with your Twitter user name.
• Upload the two files to some webspace of your choice (let's call it http://www.example.com/example)
• Now insert the IFRAME tag on the page where the updates should appear; remember to edit the "src" attribute to match the location of the HTML file:

  <iframe
      src="http://www.example.com/example/twitterUpdates.htm"
      style="width:200px;height:200px;border:1px solid #eaeaea;padding:1px"></iframe>
  

• The next thing you'll want to do is to change the colors, width and height, the bullet image, etc.

[Update 2009-02-09] Thanks to "Tucker" for making me aware of a problem with the links clicked inside the iframe when using Firefox. I'm pretty sure that things were working in IE and Firefox when I wrote the blog post, but in the meantime both the version number of my Firefox browser and (more importantly) the script provided by Twitter have changed, so I cannot check that. Anyway, I have modified the file twitterUpdates.htm and now clicking a link inside the iframe opens a new browser window both in IE and in Firefox.