The week has come to an end and so has your Church Events Page!
Today, we will put your work into action and add one final touch as we learn how to create a WordPress Church Events Page.
You New Church Event Page
Go ahead and open up your WordPress Admin and create a new page.
You’re probably going to want to name it ‘Events’, but it really doesn’t matter. You can, of course, integrate it however you want. It can be added and integrated just like any other Page you’ve created in WordPress. Add it to your main menu, drop a link in your sidebar, whatever your flavor.
As you’re creating the new Page, select the Page Template you setup in Part 3.
Now you’re all set!
Go ahead and preview your new Page!
You did it!
Houston!
Yes, there is a problem.
If you’ve used a more tag or kept the link titles as live URLs (like I did myself), you’ll find that clicking on them may not generated a very nice response.
Don’t worry, I’ve got you covered.
First, open your single.php file in your theme and, like always, save it under a new name — single-event.php.
Look for the same Loop code we found in Part 3.
Change the ‘loop’ to ‘loop-event’:
[cc lang=”php”]get_template_part( ‘loop’, get_post_format() );[/cc]
To:
[cc lang=”php”]get_template_part( ‘loop-event’, get_post_format() );[/cc]
This will also kick-in any sharing plugins or code you have setup in single Post view. This makes it easy for Church members to share Events!
A Little Extra on the Side
If you recall in Part 2, I reserved a spot in the Loop:
[cc lang=”php”]
[/cc]
Let’s go ahead and do something with this, shall we?
In your functions.php or Functionality Plugin (which I’m using), add this snippet:
[cc lang=”php”]/* Render Custom Field */
function get_custom_field_value($szKey, $bPrint = false) {
global $post;
$szValue = get_post_meta($post->ID, $szKey, true);
if ( $bPrint == false ) return $szValue; else echo $szValue;
}[/cc]
Jump back to the loop-events.php we created in Part 2 and drop in a new line of code.
Before:
[cc lang=”php”]
[/cc]
After our new snippet:
[cc lang=”php”]
[/cc]
As I’ve stated several times, some bits and pieces depend on the theme you’re working with, but the core of the code I’m showing you will work in your theme. The specifics come with the styling and structure of your HTML and CSS.
Now that you’ve added these little snippets, it should display the date from your Custom Field:
Congratulations!
How cool are you?
You’ve now created a completely closed Events listing system.
When we first started, we set out to:
- Dedicated Events listing in WordPress Admin — CHECK!
- List Events on the Events Page in ascending order, based on Event date, not date posted — CHECK!
- Automatically stop displaying Events on the Events Page that have already occurred — CHECK!
With your Events isolated like this, we can do some extra cool things like display the most recent three events on the front page of your Church site! (We’ll cover this at a later date.)
Now that you’ve succeeded at this, how about an Announcements page?
Easy.
Just replace every “event” with “announcement.”
See:
😀
Chris says
This series was very helpful definitely will be using, thanks.Quick question, do you know of a plugin or a wordpress work around that allows for members to sign in and view and update the church directory?
Kyle says
The WP-Members plugin may help.
Eric Dye says
Ah! Just saw you’re comment, Kyle. Good call.
Eric Dye says
That’s a good question, Chris. When you say, “directory,” do you mean member info?
Paul says
Or you could just use Events Calendar Pro like we have done at our church which also allows you to show a calendar view aswell as a list view and show widgets of the calendar or upcoming events. Well worth every penny! Check it out on our website at http://www.cliftoncommunitychurch.org.uk
Eric Dye says
Great solution, there.
Drew Palko says
So, I’m working on getting this up and running, but it looks like, events in 2012 aren’t showing up for some reason. Any idea why?
Eric Dye says
Just tested it on mine and it handled it fine.
Make sure you do the date format like so:
01/01/2012 for January 1st, 2012.
1/1/2012 will bug-out it out.
Maybe that’s the problem?
Drew Palko says
ya, I checked that. hmmm i guess more trials… Thanks
Drew Palko says
Just read this in reference to ordering by meta_values:
wouldn’t that mean that 01/29/2012 would be read as BEFORE 12/25/2011?
Eric Dye says
Dude. Tried it. Works. Drop me your code?
Eric Dye says
You guys are totally, right! Need to update this, since you have to lead with the year.
April says
I followed this to the letter as far as I can tell and I keep getting the following:
The website encountered an error while retrieving http://designjunky.org/Test3/?page_id=133. It may be down for maintenance or configured incorrectly.
The site is http://designjunky.org/Test3/
April says
I’m at a loss on what to do, can you help me?
Eric Dye says
Hummm. Just took a look. Email me offline: eric [at] churchm.ag
I can take a look at your code.
April says
Thanks
April says
I finally got it working in another test environment so I’m just going to copy the code over. Thanks!
Eric Dye says
WOOT!
You’re a rockstar!
Ryan Card says
Thanks for this post! Working to implement it into a site I’m working on. I’m still fairly new to WordPress theme development. Is there a way to format the output of the date from 02/23/2012 to February 23, 2012?
Eric Dye says
Yes and no.
(In fact, this needs to be updated, as you must lead with the year, first.)
YES, can display the date however you like, but NO it won’t be able to compute the date as wether to display it or not.
Understand?
Ryan Card says
So, by changing the format of the output, it will mess up the custom field knowing whether to display the post or not? Is that what you mean by the “no”?
Eric Dye says
Sorry Ryan. Clear as mud, right?
I’ve added a post update to the end of this post (https://churchm.ag/wordpress-events-page-4/). That should clarify things. If not, just ping me, again!
April says
Is there a way to make a footer widget populate one or two titles of the events and then a link that says more?
Eric Dye says
Hmmm. Sounds like a follow up is needed. Not sure about the widget, but I can post something that can be added to your front page or sidebar. Stay tuned!