800,000+ WordPress sites are already using MetaSlider!

How to Create The Events Calendar Slideshows

The Events Calendar plugin is the most popular way to show events in WordPress. MetaSlider is the most popular way to create slideshows in WordPress. Together, The Events Calendar and MetaSlider make a great combination! In this guide, we’ll show how to build an Events Calendar slideshow.

MetaSlider can automatically create slides based on events in The Events Calendar plugin, displaying the featured image as the slide. This feature is often used by schools, non-profits, sports clubs, and others, to help people see upcoming events.

Click here to see a demo of an Events Calendar slideshow. The documentation under that slideshow gives details on how to create that exact demo.

In this guide, I’ll give you a more general introduction to using MetaSlider and The Events Calendar together.

Video Guide to MetaSlider and The Events Calendar

How to Create an Events Calendar Slideshow

  • Install MetaSlider Pro. We’re going to be using the “Post Feed” option in the Pro version.
  • Install the Events Calendar plugin and create some events. Make sure to use the “Featured Image” field for each event.
The Events Calendar featured image
  • Go to “MetaSlider Pro” and create a new slideshow.
  • Click “Add Slide”
  • Choose the “Post Feed” option:
Adding a Post Feed slide
  • Click the “Post Types” option.
  • Choose the “Events” post type.
Choose events for a slideshow
  • Go back to the “Caption Template” area.
Caption for an Events Calendar slideshow
  • You can now decide what information shows on top of the featured image. In the demo site example, we’re using this code below:
<em>{event_start_date} - {event_end_date}</em>
<a href='{link}' class='slider-button'>More Information</a>

There are many more fields available to show from The Events Calendar. Here’s a full list of the options you can use:

  • Date: {event_date}
  • Start Date: {event_start_date}
  • Start Time: {event_start_time}
  • End Date: {event_start_date}
  • End Time: {event_end_time}
  • Address: {event_address}
  • City: {event_city}
  • Country: {event_country}
  • Full Address: {event_full_address}
  • Phone: {event_phone}
  • Province: {event_province}
  • Region: {event_region}
  • State: {event_state}
  • State / Province: {event_stateprovince}
  • Venue: {event_venue}
  • Venue ID: {event_venue_id}
  • Venue Link: {event_venue_link}
  • Zip: {event_zip}

These options are all available via the dropdown menu in the “Caption Template” option:

The Events Calendar slideshow

This Events Calendar integration is just one of many available in MetaSlider. For example, check out how to create a WooCommerce slideshow of products.

This image below is an example of MetaSlider and The Events Calendar together to show over a dozen upcoming events:

MetaSlider and The Events Calendar together

There are also a wide variety of ways you can customize your slideshow. For example, you can show Portrait and Landscape images together, add thumbnail navigation, or create a text and image carousel. This next example is using the thumbnail navigation:

MetaSlider and The Events Calendar example

2 Replies to “How to Create The Events Calendar Slideshows”

  1. April 9, 2024

    Do you have any plans for supporting other events calendar plugins? We use EventPrime Events Calendar.

    1. Steve Burge
      April 9, 2024

      Hi Larry. This is supported already with our custom fields feature: https://www.metaslider.com/docs/how-to-use-custom-fields-in-post-feed-slides/

      Here’s a screenshot of MetaSlider and the EventPrime Calendar: https://imgur.com/a/eN5JTiQ

Leave a Comment

Start Using Your Slider Today!

Create and publish WordPress slideshows in minutes… What are you waiting for?