Format Date with Event Calendar and Slider Revolution

This is a solution for creating a format date filed using Slider Revolution by ThemePunch and The Events Calendar by Modern Tribe.

Format Date Requierment

I use the Avada theme by Theme Fusion and it comes with Slider Revolution. I recently had the desire to display a slider on the home page to advertise some events that are coming up, and naturally, one would think an important aspect of the slider would be the date.

Out of the box Slider Revolution comes with an option called {{meta:somemegatag}} or more specifically {{meta:_EventStartDate}}

This option seemed the appropriate and easy solution to display the date.

Not Exactly

Sure enough using the meta field “_EventStartDate” would yield a very simple date result but the date format was not exactly what I was looking for. This lead me to research for a solution that would allow me to manipulate the date in the format I desired.

Since I had the date I figured all I had to do next was understand how to format the date of the meta information inside of the slider, easy-peasy right?

To my surprise, I couldn’t find anything that would allow me to control the output of _EventStartDate. I researched this and googled it for weeks and was not able to come up with a viable and simple solution. Everything I tried would just not work.

Modern Tribe suggested using a function called tribe_get_start_date which you can apply the date format to, so I decided to give that a whirl and create a short code by following some simple instructions from Bobby Bryant (you should definitely check out his YouTube series!).

The Format Date Code

I came up with some very simple code and if you paste this code into your funtions.php file (in your CHILD THEME) you should be able to format the results.

You should be able to use this short code [event_date id={{id}}] inside of Slider Revolution to get a result with a date with a more “reader friendly” format.

(Note that the id={{id}} is required)

And if this isn’t exactly what you are looking for you are able to format the date anyway you want using the Date & time format for PHP https://php.net/manual/en/function.date.php within the short code itself by adding the “format” option.

Simple Examples:

For some simple examples:

I also added the display and timezone option if you wanted to use those but I have not found a use myself. I am sure that this code can be cleaned up and made more efficient but I just wanted to share my quick solution for anyone looking for one.

Please feel free to contribute a more robust version of the code if you would like!

Important note, I believe that Slider Revolution 5.3 may be the minimum version required to use this short code as I believe they added the {{id}} option in that version.

Happy Coding!