Complete guide on building event listing using custom post types


Ever since I’ve known WordPress, it has been impressing me via its versatile and power-packed features. Right from allowing me to have complete control over my website/blog’s admin panel to rendering me an absolute flexibility of extending the built-in functionality, WordPress has done it all. Custom post types are one such fabulous customizations that have served as the right tools for enhancing WordPress inbuilt features beyond boundaries.

What all is covered in this post?

As an extension to the above paragraph, this post will allow you to know interesting details about WordPress custom post types and the way in which they can be used for creating remarkable event listings.

Understanding WordPress Custom Post Types

While a WordPress blog comprises of three types of content viz: blog posts, blogroll links and static pages; what if you want to cross boundaries and add a special kind of content that doesn’t fit your WordPress blog’s chronological order. It is here that the role of custom post types comes to play. For instance, if you’re selling laptops via your WP site and are looking for a way that can allow you to post details of laptops available for sale in addition to offering you the flexibility of updating the web pages with different laptops on a weekly basis, then you’ll need a custom post type. This new post type can be named as “Laptops” which would allow you to include specific details(varied prices, discounts, software etc.) for different models of laptops, without affecting the existing posts and pages.

Knowing Events Listing better

Nowadays, several websites belonging to groups/clubs expect a specific kind of events calendar that can make their visitors/registered members familiar with different events scheduled for the future. An easy way to achieve this is to create a separate post type called ‘Event’ where every bit of information regarding the upcoming events can be included, to be published on the site at a later point of time. The best feature of this post type is that it comes with its own unique admin interface.

A closer look at creating a custom post type called ‘Event’ in WordPress

To create a new custom post type ‘Event’ in WordPress, you’ll be required to make alterations to your WordPress core theme files. To put it simply, you’ll need to edit the functions.php file. Just add the below mentioned code snippet at the end of your functions.php file, before the closing PHP tag:

add_action('init', 'events_init');
function events_init() {
$args = array(
'labels' => array(
'name' => __('Events'),
'singular_name' => __('Event'),
),
'public' => true,
'rewrite' => array("slug" => "events"),
'supports' => array('thumbnail','editor','title','custom-fields')
);
register_post_type( 'events' , $args );
}

The above code is all about declaring key properties(for eg: labels for admin interface), charting out rules for handling URLs and deciding about the features(for eg: thumbnails, a content editor for adding/editing event title, event descriptions etc.) that would be supported by the created post type.

Once you’re done with pasting the above code in your functions.php file, simply reload the blog. You’ll be able to see a new events section within the sidebar of your admin dashboard. Here’s a screen-shot for the same:

Event-Listing-post-Type

After this, you can proceed ahead to adding some events by creating a new custom field called ‘date’ which would indicate when the event is scheduled to take place. The screen for this is shown below:

Add-New-Event-Listing

While adding an event, ensure to use the custom fields for specifying the event’s actual date rather than allowing the system to fetch a random date which is exactly similar to the publishing date of the post. Moreover, don’t forget to make the necessary changes in the permalinks settings page within your admin panel because the theme needs to regenerate its permalink structure in order to accommodate the newly created custom post type.

Creating ‘Events Listing’ Page

Now that you’re done with adding some events in your WP Blog, you’d definitely want to list them at an appropriate location. For this, you can create a dedicated page called ‘Events Listing’ which can further be added to the regular page list including Contact Us, About Us etc. Follow the below steps for creating an ‘Events Listing’ Page:

Step 1- Prepare a copy of your index.php or page.php

Step 2- Rename the copy as custom-events-template.php or something similar to this.

Step 3- Open custom-events-template.php file and add the below mentioned code snippet at its starting:

<?php
/**
* Template Name: Events Page
*/
?>

Once you’re done with adding the above code, find the line that’s similar to this:

<?php if (have_posts()) : while (have_posts()) : the_post(); ?>

and just before this line of code, add the below code:

<?php query_posts( 'post_type=events'); ?>

In the above code, I’ve simply created a new query, to which I’ve added attributes to make it the new event post type.
Using the new ‘Events Listing’ page template

To use the newly create page template, you’ll be required to create a new page, name it as per your preference and choose the created page template from page attributes box. Mere publishing of post will make your event visible to the users in the front-end, eliminating the need for adding any content to this page.

Now, in order to ensure the display of events as per their scheduled date, instead of date on which the event got published; you’ll need to replace the query with the following code:

<?php query_posts ( ' post_type=events&meta_key=date&orderby=meta_value&order=ASC'); ?>

In addition to above, if you want to display the event date in the original event post, simply add the below code snippet just after the_content() function within the page template:

<?php
$date = get_post_meta($post->ID, 'date', true);
if ($date){
echo 'This event will be held on: '.$date;
}
?>

Here’s the screen-shot for how the event details would be displayed on new events page, with additional events displayed in a chronological ascending order of their scheduled date

Event-Listing-without-plugin

So, that’s it!

Wrapping Up

I’m sure by now you’d have grabbed a good understanding of creating event lists with the help of custom post types in WordPress. Hope the above information serves as a handy guide during implementation of all upcoming WordPress web development projects that expect you to build an events calendar.




Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>