Welcome to the final part of our tutorial on how to write your own WordPress Twitter Widget.
Continue Reading →
All posts tagged PHP
How to write a WordPress Twitter Widget – Part 3 of 3
How to write a WordPress Twitter Widget – Part 2 of 3
Welcome back! So you should have read through part one of the tutorial, where we left things off with the following line of code:
$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'
';
// 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
class 'WordTweet' is there for our CSS styling
// The
unordered list is how we'll be displaying each Tweet
echo '
';
// 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
tag
echo '
- ' . $message . '
';
} // ...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 '
';
} // 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'
';
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.
How to write a WordPress Twitter Widget – Part 1 of 3
So you may have noticed in the sidebar over there on the right there’s a bunch of my recent Tweets. There are plenty of WordPress Twitter widgets, some better than others, but why not start and write your own? In this three part tutorial we’ll look at putting together the basic code, and then in further episodes we’ll start getting a little more advanced with some jQuery scripting.
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.
How to create a WordPress Widget – Part 2 of 3
Let’s recap. So far we have the following code:
< ?php
/*
Plugin Name: A Simple WordPress Widget Tutorial
Plugin URI: http://www.richardshepherd.com
Description: Simple Widget Tutorial from RichardShepherd.com
Author: Richard Shepherd
Version: v1.0
Author URI: http://www.richardshepherd.com
*/
function widget_widgetTutorial($args) {
// First we grab the WordPress theme args, which we
// use to display the widget
extract($args);
// Now we sniff around to see if there are
// any preset options
$options = get_option("widget_widgetTutorial");
// If no options have been set, we need to set them
if (!is_array( $options )) {
$options = array(
'title' => 'Widget Title',
'text' => 'Widget Text'
);
}
// Display the widget!
echo $before_widget;
echo $before_title;
echo $options['title'];
echo $after_title;
//Our Widget Content
echo $options['text'];
echo $after_widget;
}
You should already have read part one, and know what all the above does.
We have two more things to do to get this widget working. Firstly we need to put together our options function, which allows the user to set the variable ‘text’ to whatever they want. Secondly we need to ‘register’ the Widget with WordPress so that it actually appears as part of your blog.
In this, part 2 of a 3 part tutorial, we’re going to concentrate on setting up those options. In the third and final installment we will register the widget with WordPress and launch it! Continue Reading →
How to create a WordPress Widget – Part 1 of 3
So how do you put together your own WordPress widget? All you need is to know your way around PHP. If you can program your application in PHP the chances are it can be turned into a Widget.
I’m first going to go through the structure of a Widget, and then we’re going to get our hands dirty with some code.
A basic Widget has four main components:
- The Widget Information
- The Widget Itself
- Any options for the Widget
- Initialising/Registering the Widget
Widget Header
The Widget Information is just a bit of information at the top of the file which WordPress uses to describe the Widget. It might look like this…
/*
Plugin Name: A Simple WordPress Widget Tutorial
Plugin URI: http://www.richardshepherd.com
Description: Simple Widget Tutorial from RichardShepherd.com
Author: Richard Shepherd
Version: v1.0
Author URI: http://www.richardshepherd.com
*/
Everything there is fairly self explanatory. The URI (Uniform Resource Identifier) is just a fancy (and more correct) way of describing the URL. Don’t worry too much about that for now. Continue Reading →
phpFlickr Widget
You may have noticed a new widget in the sidebar called the phpFlickr Widget.
It’s a widget I have developed for WordPress which allows you to include your Flickr photos in your blog, and display them with the rather funky Slimbox tool. Click on one of the photos and see what I mean. Slimbox, as well as looking great, allows you to navigate back and forth if you hover your mouse over the top left and top right of the picture.
The widget itself has a number of configurable options which are easy to set up and change. At the moment they include:
- API Key
- API Secret
- Set ID
- Number of photos
- Photos per row
Before I release the widget I’ll be adding some more options, including the Flickr username and an ability to style how the thumbnails are displayed. At the moment they are just 50px squares.
Stayed tuned for more phpFlickr fun.
php Image Rotator :: Making sense of the code
So let’s look at an image rotator that comes bundled with this WordPress theme. It’s actually coded by the founding WordPress developer and Internet ubergeek Matt Mullenweg (whose funky website is accompanied by a funky URL: http://ma.tt). The full code for the rotator is here, but I wanted to work my head around a couple of lines.
Here’s a snippet from the code:
while (false !== ($file = readdir($handle))) {
foreach($exts as $ext) {
if (preg_match('/.'.$ext.'$/i', $file, $test)) {
$files[] = $file;
++$i;
}
}
}
Hmmmm, we need to look a bit closer at what’s going on there… Continue Reading →
Rollognese
I was ridiculed yesterday for taking my leftover bolognese sauce and popping it in two wholemeal bread rolls. I call it “Rollognese”.
I didn’t invent this delicacy, and nor do I see what’s wrong with it. Admittedly it is a little sloppy to eat, but that’s half the fun.
In other news, some great PHP tips for you.
Oh, and I only have one credit on IMDB, www.imdb.com/name/nm2030074, but there is someone else who shares my name www.imdb.com/name/nm0791847 !!
All Change, please. All Change.
So, we’re back. It’s been almost a year but it’s time to get this show on the road once more.
What can we expect from RichardShepherd.com? More and more updates, correctly categorised and tagged for your viewing pleasure. See that bunch of random words in the top right corner? Well, as I add more and more info those words will start to inflate. The larger the word, the more I’ve written about it. It’s called a Tag Cloud, and it’s the future, man.
I’ll be writing, blogging if you will, three different things over the coming months..
The first is web design. I’m what you might call an intermediate user, and I want to take this to advanced. This involves brushing up on php, mySQL and Javascript in particular. I’ll be embarking on a few projects, like designing a WordPress widget and Facebook application from scratch, and hopefully we’ll all learn something along the way. Of course as I do, this site will evolve and be a work in progress. A playground, if you will.
The second is film. Or film-making, to be precise. I’ve had a modicum of success with some short films and commercials I’ve directed, but it’s been over a year since I called ‘action!’ so it’s time to get our hands dirty again. As we piece together our next epic short, the front row seats to the behind the scenes action is right here.
The third is the ramblings from my over-productive and underutilised brain. We have a lot to discuss, and that why there’s a new poll feature on the right hand side of these posts. I’ll change it every so often, and would love to hear ideas or questions.
