Add Your Recent Tweets to Blogger

If you’ve got a Blogspot.com blog, you can add your Twitter feed to the sidebar very, very easily. The feed will list your last 5 tweets, as well as the time it was posted and link to follow if the reader chooses. I’ve seen several variations of this code and its presentation, but the one I use on my own blog, and the one I use when installing blogs for other people, is the simplest version possible. Why? Because I don’t want the script slowing the loading down and I don’t want the widget itself to look wonky in different browsers or screen resolutions. If you’d like to add your recent tweets to your blogger sidebar, this is how you do it:

First, you'll need to edit the code:

You will need to make TWO very easy changes. The code you see below is the code for my own personal twitter feed, and you will need to edit it to display yours. I have left my twitter name (IsabellaSnow) in place so that you can see exactly where yours will go. Simply copy your twitter user name and paste it directly overtop of mine (IsabellaSnow) – in both places. Once that is done, your code is ready to show your own twitter feed. Make sure you that you do not paste over top of, or remove anything which is not bolded. If you do, it won’t work. And if you make a mistake, simply come back here and copy the code again and start over. Easy peasy.

Here's the code:

<div style="margin-right:0px"><div id="twitter_div">
<h2 style="display:none;" class="sidebar-title">Twitter Updates</h2>
<ul id="twitter_update_list"></ul>
<a id="twitter-link" style="display:block;text-align:right;" href="http://twitter.com/IsabellaSnow"></a>
</div>
<script src="http://twitter.com/javascripts/blogger.js" type="text/javascript"></script>
<script src="http://twitter.com/statuses/user_timeline/IsabellaSnow.json?callback=twitterCallback2&amp;count=5" type="text/javascript"></script></div>

Now you’re ready to install

• Log into your Dashboard.
• Click on 'Layout'
• Go to the sidebar in question and click 'add a gadget'
• Click on the 3rd option down, which is titled 'HTML/JavaScript'
• Copy and paste your new code into the box.
• Click 'save'
• Position the widget wherever you’d like – most people put it somewhere near the top. If you’d like to see how mine looks you can take a look at my blog.

Add a cute icon!

If you do take a look at my blog (use the link in the previous paragraph) you’ll notice that I used a Twitter logo to attract people’s attention to the feed and to make it clear what it was. You can find loads of free twitter logos around the net and then display it above your feed to give it a more personal touch.