Using the time tag in WordPress and when parsing RSS feeds

The <time> tag is a little used but very effective little HTML element that allows you to embed additional information to dates and times in your content. The idea is that in addition to the actual text that shows the visitor the time, you can provide the browser, search engines and other computers with actual time information they can understand. Very cool.

For a recent project I had to parse time tags both from WordPress and from an RSS feed. After some mucking about I found what I think is the optimal solution, so to save you some time I’ve put it all together for you.

Date stamp for WordPress using the <time> tag

WordPress can output the publishing date and time in pretty much any configuration you want. For the time tag to work you need the datetime variable to show the time in a specific format that looks like this:

2012-01-30T18:55:21+08:00

That’s year, month, date, time (international) and an optional time zone reference. I’m in Vancouver, Canada so that’s GMT+8 hours.

Using the get_the_date() function in WordPress you can get this time format and any other. In this case I wanted the format “Jan. 30, 2012”.

The end result:

<time class="entry-date" datetime="<?php echo get_the_date( 'c' ); ?>" pubdate><?php echo get_the_date('M. j, Y'); ?></time>

Date stamp when parsing RSS feeds using the <time> tag

For the project I also needed to parse an RSS feed and show the details of each item in an index page. RSS feeds output the date in a standardized format, but it is rather unsightly:

2012-01-30T23:00:00+00:00

I needed to get this parsed to match the example above. To do so I used a handy PHP function provided by Handy PHP called Reformat Date. This function uses the strtotime() PHP function to reformat dates into anything you want simply and easily.

First I added the function itself to the functions.php file in my theme like this (notice I append the name of the theme at the front of the function name to avoid any future clashes should WordPress decide to bake this feature in):

// Reformat date for RSS feed
function theme_reformat_date($date, $format){
// Function written by Marcus L. Griswold (vujsa)
// Can be found at http://www.handyphp.com
// Do not remove this header!

    $output = date($format, strtotime($date));
    return $output;
}

Second I grabbed the RSS feed using WordPress’ native RSS import function (I’ll write about that in a separate post but it’s pretty straight forward) and then I parsed the data.

Note: In an RSS feed the time is contained in each item under the handle pubdate so to get the raw time I use $item[‘pubdate’].

<?php echo theme_reformat_date($item['pubdate'], 'M. j, Y'); ?></time>

Note that the date has to be reformatted twice, once for machine readable output (‘c’) and once for the human readable output (‘M. j, Y’).