Navarr's Tech Side The Technical Side of my Life

12Feb/0819

JavaScript: Simple Twitter Feed

This is code that I will kindly let anyone use.  It only works with public twitter accounts, however, but it is perfect for placing on any web page.

First we have the Inclusion of the File (can only be included once per page). Then the HTML for where the Twitter Feed is going to go, and then the JavaScript to include the file.

<script type="text/javascript" src="http://www.gtaero.net/twitter/twitter.php?user=USERNAME"></script>
<div id="twitFeed">Optional Placeholder Text</div>
<script type="text/javascript">twitter2id("twitFeed");</script>

Feel free to use this code anywhere you want to.  It is my gift to you!

UPDATE: Some additional (optional) variables have been added to the script for further tweaking.

February 24, 2008.

UPDATE: Support for twitter lists and turled profiles has been added to the script.  Your script might break with these changes, please view the post for more information.

October 30, 2009.

  • webchick.org

    Great Script – curently in use at http://webchick.org/.

    I had no problems whatsoever with the install and instructions (although they are geared at the clueful) … however you are missing two quote marks …

    One after -

    {integer:amount of posts|default:10max:20}

    and one here -

    script type=”text/javascript

    (in the javascript include)

    Otherwise, it worked great! Thank you so much for this script!

  • miro

    Thank you so much, this is brilliant.

    And nice and simple which is just what I needed.

    You are awesome!

  • Locke

    I know it says it can only include the file once per page, but is there any possible way to display two feeds?

  • Navarr Barnier

    Theoretically based on how JavaScript works you may actually be able to re-include the javascript a second time later on in the file, thus over-writing the original function. (past the placement of the first feed).

    I haven’t tried this, however, and I don’t normally recommend it (and I will not support any bugs it creates).

    But go ahead and try, if you want to ^.^

  • Locke

    First of all (I should have said this in my first comment) this script is amazing. Compared to some other ones I tried, it’s so much simpler and just an excellent solution. So good job.

    As for dual feeds, when I try to add the javascript a second time, it only displays the second one. I don’t know much about javascript or html in general, so if you were going to try this, what would your code look like? I won’t hold you responsible for anything that goes wrong. :)

    Thanks for the help!

  • Stretch

    Wow, thanks a ton for making this available! Turns out, this is a fantastic way to use Twitter Feeds in a Joomla Wrapper. Twitter killed the use of iframes and this gets me around that.

    Working on formatting it, but this is a fantastic little script!

    http://www.seasonedgamers.com/home/index.php?option=com_wrapper&view=wrapper&Itemid=106

  • Cory

    Thank you for the code. I'm now using this script on my page at http://www.justwritestl.com and it's great.

    Cory

  • greenline creative

    I love this code, It feeds my tweets, but i can not get it to format for the life of me, It also has a bullet in front of my tweet. Can anyone help me with my formating issues, as far as the code feeding and working correctly, not a problem works fine.

    Thanks

    Dennis

  • Keyan

    Bitchin' code! One question how could I make it instead of feeding a user feeding a topic i.e. "dogs" or whatever?

  • Matt

    I'm using it on http://www.wickcopy.com. Thanks!

  • http://www.gtaero.net/ Navarr Barnier

    You can disable the little bullet point by using CSS on the List:

    <ul style="list-style-type:none;">

  • http://boofplaza.com Taki

    Hey,
    I just used it on the new weblog I designed for myself, simple and does the job.
    Thanks.

  • Pingback: Navarr's Tech Side » SimpleTwitter Update

  • Pingback: Navarr's Tech Side » JavaScript: Changes to the Simple Twitter Feed

  • http://lebaxxx.com mattt

    hey guys
    i was having an issue with this feed pulling old tweets, mainly from the day i ftp’d it

    i fixed it by changing this

    if(file_exists(“twitter_$user.json”) && date(“i”,filemtime(“twitter_$user.json”)) mktime() )

    hope this can help someone else

    lebaxxx.com

  • http://www.gtaero.net/ Navarr

    I think some of the code you posted in the comment was stripped out. The code that you changed,

    date(“i”,filemtime(“twitter_$user.json”)) < date(“i”)+4

    was designed as a cache system, to only pull a file if it was less than 5 minutes old (because of rate limiting).

    If you don’t want to cache it, you can probably pull out the entire file storing procedure.

  • Pingback: Paul Lynch’s Pages : Including Twitter on a web page

  • Michael

    This is cool – I needed to add a twitter feed with no issues and minimal coding — thanks for letting the public use this.

    Cheers

  • Trackedintooting

    This is great. Is there anyway of changing the font style & colour?

  • http://tech.gtaero.net/ Navarr Barnier

    This really shouldn’t be used anymore.. but yeah.. use CSS.

  • Geenee

    Hi!

    first of all thanks for the code. very easy and very handy!
    but unfortunately i have some problems with it.
    on mac (firefox & safari) it shows a small vertical scrollbar for every single tweet, which i can’t remove via css (overflow:auto or similar). do you have any idea what else i could try?
    and is it possible to customise the space between the tweets?

  • http://tech.gtaero.net/ Navarr Barnier

    This code is no longer supported. I recommend using Twitter’s API.