Modifying Twitter Updates

You'll need an account at Twitter.com first of all. And under the settings tab, find where you're supposed to fill in your site URL. Directly underneath that is a link to put twitter updates on your site.

To customize how your twitter updates appear, we'll use a the list properties in our stylesheet.css page, like shown below:

.twitter li{
background-color: #COLOR;
color: #FONT COLOR;
border:1px solid #COLOR;
list-style: none;
text-align: LEFT,RIGHT,CENTER;}


One of the most important parts of the code I've just shown you is the list-style:none; part. This will get ride of the bulleted list style, and have it just show up as a regular paragraph style.

Now we want to put the code into our HTML document that will make our twitter updates appear.

<div class="twitter">
<div id="twitter_update_list"></div>
<a href="http://twitter.com/YOURUSERNAME" id="twitter-link" >Follow me </a>
</div>


In order for this to work, you must keep the <div id="twitter_update_list"></div> part in there.

Replace: a href="http://twitter.com/YOURUSERNAME with your user name.

Lastly, you will need to place this code into your HTML document, preferrably at the bottom. It doesn't really matter, because it doesn't show up, it only references your twitter updates. I stick mine at the bottom so it wont stall any uploading of my other pages just because it's waiting for my twitter stuff to load.

<script type="text/javascript" src="http://twitter.com/javascripts/blogger.js"></script> <script type="text/javascript" src="http://twitter.com/statuses/user_timeline/you.json? callback=twitterCallback2&count=5"></script>

count=5 (This number controls how many of your twitter updates to show on the page)