How To Create An Events List With WordPress

When I did the recent design changes to DavidRisley.com, one of the things I wanted to do was add an events list. You can see it off in the right sidebar.

The idea behind it is simply to be able to use the blog as a central platform for all events that I do, including webinars, launches, live events – anything with a particular date assigned to it. Even if I do a call only for my students, I’ll still list it here on the blog.

From a technical perspective, this looks easy. But, it isn’t. It took me some time and testing to figure out what I’m about to show you.

My goals were simple:

• List upcoming events.
• Have each event be clickable into a post about that event.
• Once the event is past, don’t display it.

First, I was going down the path of displaying future posts. This is easy to do with WordPress. I’d simply timestamp the post with the time of the event and future post it. Right? Wrong. That approach would work if I don’t want anybody to be able to click for more details, however WordPress prohibits people from reading future posts unless you’ve got sufficient privileges. So, scratch that.

Next approach is to use regular posts, assigned to an “Events” category, and display those. Again, this doesn’t serve my needs because it would, by default, not show upcoming events, but only past due ones.

Next approach is to use regular posts, but use a custom field for the date of the event. I was getting warmer by this point, however the problem remains – past events are still listed.

Let’s jump right to the solution. We want to query for posts using custom fields, and make the query so that when that custom field is past a certain value (the present date), it doesn’t display. After tons of trial and error, I arrived at this:

<h1>Upcoming Events</h1>
<?php
$timecutoff = date("Y-m-d");
$args = array(
'category_name' => 'events',
'orderby' => 'meta_value',
'meta_key' => 'eventsortdate',
'meta_compare' => '>=',
'meta_value' => $timecutoff,
'order' => 'DESC'
);
$my_query = new WP_Query($args);
if ($my_query->have_posts()) : while ($my_query->have_posts()) :
$my_query->the_post();
$eventdate = get_post_meta($post->ID, "eventdate", true);
?>
<ul id="events">
<li>
<strong><?php echo $eventdate; ?></strong><br />
<a href="<?php the_permalink() ?>"><?php the_title(); ?></a>
</li>
</ul>
<?php endwhile; else: ?>
<ul id="events">
<li><?php _e('No Events Scheduled! Stay Tuned.'); ?></li>
</ul>
<?php endif; ?>

What I’ve done is create TWO custom fields: “eventdate” and “eventsortdate”. The “eventdate” is the human-readable date and time of the event. The “eventsortdate” is the date of the event in YYYY-MM-DD format. By comparing the value of “eventsortdate” to the present date ($timecutoff), I can simply make the query ignore events where the day of the event is in the past. If it is greater than or equal to the present, it displays in all it’s glory.

When there are events on the list, it’ll look like this:

The post link will be fully clickable so that a person can read details about the event as a regular post.

Hope this helps somebody.