So, in an homage to her and Ken Jones – and all those Top 10 (7?) lists out there on Twitter – here is my own list.

Yes Twitter, these are the seven things I hate about you…

1. You’re vain, your games, you’re insecure – Let’s face it Twitter. Everyone on Twitter loves talking about Twitter. And why? Because we want to justify the amount of time we spend on it!
2. You love me, you like her – I think that everyone is listening to me, but they’re not. They’re listening to everyone else. Damn you Twitter, you’ve made me your bitch!
3. You make me laugh, you make me cry – Okay, so I haven’t cried yet but I know it’s not far away. The first time I see that Fail Whale I’m going to bawl my eyes out like a schoolgirl who just lost her Tweeting Barbie.
4. I don’t know which side to buy – Do I Tweet because I want to learn about cool sites? Do I really want to know what a bunch of strangers are doing? Or do I Tweet because it fills up my otherwise empty life with ‘followers’ assuming that they’re also friends?
5. Your friends, they’re jerks.  When you act like them, just know it hurts – All those auto-DMers. I thought I had hundreds of friends, but they disappear as quickly as they appear. Is nothing what it seems? Bunch of fucking jerks.
6. I wanna be with the one I know – Oh Twitter, bring me comfort. Bring me company on those cold winter evenings. Tell me that I’m yours and yours alone. Ruffle those sexy blue feathers and tell Tweetdeck to ‘coo’ me another message.
7. And the 7th thing I hate the most that you do. You make me love you – Damn you Twitter. Damn you I say!

And I think that’s conclusive proof. About what I’m not sure, but thank God Miley isn’t on Twitter.

She’s not, is she?

Ranger, out.

$result = $t -> userTimeline($id=false, $count = ($options['tweets'] * 4), $since = false);

(If that looks strange, make sure you check out part 1 of this tutorial!)

We now have our Tweets stored in $result so we can just cycle through them and print them out in our widget. To do that we need the next bit of code.

Rather than explain each line after the code, I have heavily commented it which takes you through the process step-by-step…

// If there are no results, lets pop up a default message
if ($result===false) {
echo "Sorry, nobody's home! Back in five.";
 
// Success! We have Tweets! Let's display 'em!
} else {
 
// First we grab our CSS stylesheet. It's a really simple one, but it's good practice to
// keep this in a seperate file.
echo'<link href="' . get_bloginfo('url') . '/wp-content/plugins/WordTweet/WordTweet.css" rel="stylesheet" type="text/css" media="screen" />';
 
// We need a way to count the number of Tweets we display, so let's start a counter at '0'.
$iTweets = 0;
 
// The first piece of HTML. The <div> class 'WordTweet' is there for our CSS styling
// The <ul> unordered list is how we'll be displaying each Tweet
echo '<div class="WordTweet"><ul>';
 
// For each part of the array, in other words each Tweet, we grab the
// string and call it $tweet
foreach ($result as $tweet) {
// We're interested in the text within the Tweet, not the other
// information like date (until later!). Let's grab that and call it $message.
$message = (string)$tweet->text;
 
// Now I like to take our any Tweets beginning with '@', as these are replies specifically
// to other people. If you wanted you could take this bit out, but don't forget to remove the
// closing '}'
if (substr($message,0,1) != "@" && ($iTweets < $options['tweets']+1)) {
 
// make_clickable is a helpful WordPress function that takes things like email addresses
// and websites in a string of text and turns them into links. Ah, the joy of regular
// expressions!!
$message = make_clickable($message);
 
// I don't display the first, as it's in the header of my theme, so I skip the first Tweet
//by making sure that $iTweet is greater than 0.
if ($iTweets > 0) { // You could take this line out...
// Display the Tweet, nestled in a <li></li> tag
echo '<li>' . $message . '</li>';
} // ...but you'd need to remove this too!
 
// That's one Tweet down, so let's increase $iTweet by 1
// and move on to the next
$iTweets++;
 
} // End of the If statement
} // End of the foreach loop
 
// Finish up our HTML output
echo '</ol></div>';
 
} // End of the if ($result===false) statement
 
// And now that last bit of HTML from the WordPress Theme
echo $after_widget;
}

Make sense? Let’s take a look at two lines in a bit more detail.

echo'<link href="' . get_bloginfo('url') . '/wp-content/plugins/WordTweet/WordTweet.css" rel="stylesheet" type="text/css" media="screen" />';

get_bloginfo is a handy WordPress function which returns various useful pieces of information. For example, get_bloginfo(‘template_directory’) returns, you’ve guessed it, the URL of the template directory.

With get_bloginfo(‘url’) we are grabbing the blog URI which the user has set in Settings. We then just add in the path to the .css file, which we know is in the WordTweet directory.

Secondly,

if (substr($message,0,1) != "@" && ($iTweets < $options['tweets']+1)) {

So, (substr($message,0,1) is a way of grabbing a sub-string (part of a string) from our string $message. We are interested in the first character, because I want to know if it’s a ‘@’, so we add to parameters ’0,1′ The first parameter tells PHP where to start, and we start with the first character which is in position ’0′. The second parameter is how many characters we want, in our case just the ’1′.

We then check to see if this is NOT equal to ‘@’ with !=. If it’s NOT ‘@’ then it’s not a Twitter reply and so we can display this Tweet. But we have one more check to make!

The second part of that If statement checks to make sure we are only displaying the number of Tweets the user specified. Initially this was just set as $options['tweets'], but I had to change it to +1. Why? Because I’m not displaying the first Tweet (it appears in the header of my site) I need to start on Tweet 1, not Tweet 0 (the first in our array). Which means if I want to display 5 Tweets I actually have to loop through until 5 (rather than 4 – remember 0 to 4 is FIVE Tweets).

I hope that makes sense, as it’s rather convoluted. If your blog doesn’t display Tweets anywhere else, you can remove the && ($iTweets < $options['tweets']+1)) bit.

Right, that’s it for part 2. Part three will finish things off with the options and look at the css. It’s in the css that we add the Twitter logo. I’ll also suggest some further reading, and ways you can develop this simple script further.

Go to part 1 | Go to part 3

First things first, make sure you read and understand the How to Create a WordPress Widget Tutorial, as we’ll be building on that code. In fact, adding in the Twitter code is reasonably straightforward.

Twitter has a API we can use to grab all the details, but our life get easy if we use a prewritten PHP class that does some of the hard work for us. A couple are kicking around out there, but I’m going to work with the lightweight twitterPHP by David Billingham. It doesn’t include all the functionality of the Twitter API, but it’s got everything we need to kick off with.

So, we know how to create a Widget thanks to our earlier tutorial. What we now need to do is:

1. Start with the usual widget code
2. Send a call off to Twitter with our username and password
3. Ask Twitter for a certain number of Tweets
4. Display these Tweets in our widget
5. Finish up the widget code
6. Write the code for the WordPress widget options

And that’s it. So, without further ado, I give you WordTweet – my WordPress Twitter widget!

WordTweet

Our code starts off almost identical to the WordPress widget tutorial:

<?php
/*
Plugin Name: WordTweet
Plugin URI: http://www.richardshepherd.com
Description: A  widget that displays your Twitter Tweets
Author: Richard Shepherd
Version: v0.2
Author URI: http://www.richardshepherd.com
*/
 
function widget_WordTweet($args) {
 
	// First we grab the Wordpress theme args, which we
	// use to display the widget
	extract($args);
 
	// We also need to make sure we include the Twitter Library
    require_once 'twitter.class.php';
 
	// Now we sniff around to see if there are
	// any preset options
	$options = get_option("widget_WordTweet");
 
	// If no options have been set, we need to set them
	if (!is_array( $options )) {
		$options = array(
	  	'WordTweetTitle' => 'WordTweet',
	  	'username' => 'Username',
	  	'password' => 'Password',
		'tweets' => '1'
	  	);
	}
 
	// Display the widget!
	echo $before_widget;
	echo $before_title;
		echo $options['WordTweetTitle'];
	echo $after_title;

You’ll spot a couple of changes. First we include the PHP Twitter class, which we will make sure is in the same directory as the widget.

require_once 'twitter.class.php';

Secondly we have changed our options code a little bit, to take into account the new options we need.

	// If no options have been set, we need to set them
	if (!is_array( $options )) {
		$options = array(
	  	'WordTweetTitle' => 'WordTweet',
	  	'username' => 'Username',
	  	'password' => 'Password',
		'tweets' => '1'
	  	);
	}

Next up we use the Twitter class to get our Twitter feed:

    // Create a new Twitter object and query for direct messages
    $t = new twitter();
      $t->username = $options['username'];
      $t->password = $options['password'];
 
    // This is where we grab the string as $result, from the users
    // timeline, with a $count=1 so we only get the most recent
    $result = $t -> userTimeline($id=false, $count = ($options['tweets'] * 4), $since = false);

So, we create an object $t and tell it our username and password which we grabbed from the options a few lines earlier. This is all happening on the server so it’s relatively secure – no one will see this info in our sourcecode.

Okay, then we query Twitter with the following options:

1. userTimeline – the timeline for the user specified in $options['username']
2. $id=false – This is optional, and allows us to return the results to the Twitter username or id specified. We don’t use this option, and hence set it to false.
3. $count = ($options[‘tweets’ * 4) – Stick with me on this on, as the logic is a little convoluted. $count is simply the number of Tweets to grab. Now on my homepage I display the three most recent, so you might ask why we don’t simply put $count = 3. Good question! Well, as we’ll see in the next part of this tutorial I like to remove all my ‘@’ Tweets because they are normally directed at just one persona and so not always suitable for my homepage. However, it’s impossible to know how many ‘@’ Tweets there are in any given query until we’ve actually made the query. Make sense? It might be that my last five Tweets are all good. But it might be that four of them are ‘@’ Tweets and so that would only leave me one to display. So, I grab four times the number of Tweets I want, because I’m pretty sure that if I want to display three Tweets, if I get the last 12 there are probably at least three non ‘@’ Tweets in there. Why four times? Why not! It could be * 5 or * 10 if you wanted. For me, I’m happy that * 4 is enough, although we can also set this as an option if we want.
4. Finally, we have $since = false. We can put a HTTP formatted date in here and that means we’ll only grab Tweets after that date. For this tutorial we are going to leave that as false, but you might want to introduce a new option to set this to the last day, or the last week.

That’s enough for part one. Make sure you understand what we’ve done here, and also look through the twitter.class.php and make sense of what David Billingham has done.

In part two of this tutorial we’ll cycle through our Tweets and display them in our widget. See you then!

Go to part 2 | Go to part 3