Display a forthcoming event in WordPress with Pods

UPDATE: if you are going to try this tutorial out you might want to hold on a while.

There seems to be a bug in Pods preventing this solution from working (here’s the bug post on Github).

All is not lost, in the meantime you can add an additional parameter to the array that is described further down the page. This will work for the time being:

My first project using Pods includes a simple custom post type based events listing.

On the site I promote a single forthcoming event at the top of every page that will be replaced by a new one once that date has been passed.

This tutorial will run you through my solution.

Pods Framework

In case you haven’t come across it before Pods is a plugin that adds a highly flexible and powerful custom content creation and management layer to WordPress.

It not only allows you to easily create new content types but also extend any native WordPress content type (posts, media, taxonomies etc.) with additional custom meta fields.

Even if you don’t use it for anything else Pods has a great UI for creating and managing custom post types, as opposed to hard coding them in functions.php or as a plugin.

As you would expect Pods is easily installed via your WordPress dashboard in Plugins > Add new.

Pods documentation

For the purpose of this tutorial I’m going to assume basic knowledge of Pods framework, so I won’t be explaining how to use the admin back end. And I’m assuming you know about custom post types and custom meta too.

If you need to catch up check out the Pods Framework documentation and pay close attention to this guide on setting up a custom post type.

1: Set up your Event custom post type (CPT)

Create a new CPT in Pods called Events.

Add the following field to extend Events (I’m keeping this very simple for now):

  • Event date (event_date) -> Field type “Date”

Make sure you select the correct date format (e.g. 2013-10-03 – it is easier sorting dates that start year first) in Additional Field Options.

The default post title field will serve as the Event title.

The new Events custom post type should appear as an option on your dashboard menu beneath Comments.

Now add some new events and populate them with dummy data (make sure you have a range of dates for testing purposes, some before today’s and so on).

2: The problem

The problem at hand is fairly straightforward: how to display the next event only.

So, we need to filter for our custom post type (Events), arrange them in ascending event date order (as opposed to published date) and display the first one on the list.

If you have used WP_Query before then you would be right in thinking you can use this to display Pods data (it’s only custom meta that we have created after all).

Unfortunately in this case it isn’t suitable because WordPress doesn’t let you order dates captured in custom meta fields ( I worked through this problem here).

3: The solution

I place the following in header.php, which is where I intend to promote events. I guess you can put it more less where you want in your template files.

The Pods method is pretty concise.

Get today’s date, making sure that it is in the right format to match the Pods event date (more about the date() function):

Now set up parameters for filtering our CPT by event date, ensuring that it is published (‘limit’ is set to 4 here for testing purposes). The order is set to ascending by default:

By the way, my starting point for the above was found here: pods.io/docs/code/pods/find

The notation for ‘event_date.meta_value’ was found using the handy reference table at the bottom of that page.

Now we run our ‘find’ and open the loop to fetch each relevant event:

… and again, the reference for ‘fetch’ is here: pods.io/docs/code/pods/fetch

Then simply echo each field we’re interested in using ‘display’. The events are displayed in ascending order by default:

Of course if you only want one (or the next) event to be displayed go back and set ‘limit’ to 1 in your $params.

Now, all together:

4: Create a  single CPT template

You can quickly set up a custom events page template for our CPT. Copy single.php, save as single-event.php.

Now paste something like the following inside the Loop – up to you which side of  the_content() you paste it (you might choose to leave out the_content() altogether):

Obviously a simplified example but hopefully you can see how easily this can be extended to echo additional fields for any purpose (echo latitude and longitude for a custom Google map for instance).

I’ll post more detailed snippets when I’ve got a bit further forward with the site I’m working on.

Thanks to Josh Pollock ( Pods forum mod ) for helping out with this. There are many more tutorials on the Pods Framework site.

2 thoughts on “Display a forthcoming event in WordPress with Pods

Leave a Reply