Displaying Tweets on custom pages

[mrGTB]

I was reading this site earlier about adding tweets on your own site: http://remysharp.com/2007/05/18/add-twitter-to-your-blog-step-by-step/

So after a few hours messing around I now have a custom page showing tweets, test the code out for yourself below and if you can improve upon it. Fire away with your tips! That site above does list other variables that can be used to expand this further pulling in more information with tweets e.t.c.

Create a page and use this below:
Replace mrgtbtweeting in 2 places with your twitter username.

You can: see it working here.

<script src="http://twitterjs.googlecode.com/svn/trunk/src/twitter.min.js" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">
getTwitters('tweet', {
  id: 'mrgtbtweeting',
  count: 10,
  enableLinks: true,
  ignoreReplies: true,
  clearContents: true,
  template: '<div class="primaryContent">%text%<br /><a href="http://twitter.com/%mrgtbtweeting%/statuses/%id_str%/">%time%</a></div>'
});
</script>
 
<div class="section sectionMain">
    <div class="heading">
    Twitter Feeds
    </div>
    <div class="subHeading">
    Read last 10 tweets made.
    </div>
    <div id="tweet">
    <a href="http://twitter.com/mrgtbtweeting"></a>
    </div>
</div>
 
<xen:sidebar>
<div class="section">
    <div class="secondaryContent">
        <h3>Custom Block</h3>
    Custom Block
    </div>
</div>
 
<div class="section">
    <div class="secondaryContent">
        <h3>Custom Block</h3>
    Custom Block
    </div>
</div>
 
<div class="section">
    <div class="secondaryContent">
        <h3>Custom Block</h3>
    Custom Block
    </div>
</div>
 
<div class="section">
    <div class="secondaryContent">
        <h3>Custom Block</h3>
    Custom Block
    </div>
</div>
</xen:sidebar>

 

[Trombones13]

Looks nice! I have some plans to pull in a few feeds of things from Twitter onto a page--I'll let you know how this works and if I tweak anything.

 

[mrGTB]

No problem, have a play around see what can be improved.

 

[mrGTB]

Just an update on te Twitter code section I posted above. If you use this instead it will grab your avatar and display more detailed time details (replace mrgtbtweeting in two places).

<script src="http://twitterjs.googlecode.com/svn/trunk/src/twitter.min.js" type="text/javascript"></script>
<script type="text/javascript" charset="utf-8">
getTwitters('tweet', {
  id: 'mrgtbtweeting',
  count: 15,
  enableLinks: true,
  ignoreReplies: true,
  clearContents: true,
  template: '<img src="%user_profile_image_url%" width="48" height="48" style="float:left; margin-top:2px; margin-right:6px;" alt="%user_screen_name%" title="%user_screen_name%" /> <div class="primaryContent">%text%<br /><a href="http://twitter.com/%mrgtbtweeting%/statuses/%id_str%/">%created_at%</a></div>'
});
</script>