This one was fun! I really enjoyed it and it got me playing around with some new skills, using a background image in CSS, using absolute positioning and using Photoshop to make a custom background.
Well here is how to start (all this stuff is not from me, I use the tutorials from really talented people who take the time to spell everything out, I wish I had the skill to do full out tutorials….. maybe someday!) this tutorial from Chris Coyier “How To Make a Unique Website For Your Twitter Updates” is from May 16, 2008. The only thing that has changed is the twitter code that you cut and paste. Twitter now gives you a script that you cut and paste that has some styling to it already, so you can’t just have the tweets with no styling. Chris uses just the raw twitter feed and then uses CSS to customize everything. I could not find a way to just get the raw feed, so I adapted and used there script and just put it inside of my own box. This is actually really good, it makes you think and adapt to a problem…… do some styling in the twitter widget, some styling in your PS custom background and then finally in the CSS, there is a million different ways you could do this tutorial to adapt it to your Web site.
Here are the links to the pages that you will need:
- Tut: How To Make a Unique Website For Your Twitter Updates
- Twitter Widget Page
- Link to a whole bunch of free twitter birds to download and use
Here are the finished custom Twitter pages:
- Chris Coyier Example Twitter Page From Tutorial
- Custom Twitter Page That I Made
- Here is my Photoshop background that I made
- Here is the CSS that I used
Overall this was a great tut and I recommend you dive into this one. Let me know what you think and give me a link to your custom twitter page!



{ 2 comments }
Very cool Cliff =) Looks like that new Twitter code is pretty fancy, with the older tweets fading in and such.
Thanks for stopping by Chris, this new guy really appreciates it!
Comments on this entry are closed.