Events Calendar Pro - need ability to show by event date

Beaver Builder
1

Howdy!

I’m using Events Calendar Pro (https://theeventscalendar.com/product/wordpress-events-calendar-pro/) and the Posts Carousel module in BB.

It works great EXCEPT I need the ability to show the events in order of event date, not the post date. I don’t want to have to use ‘menu order’, ‘id’ or anything that will require re-editing each post every time we post a new event to keep things showing in the proper order.

It would also be cool to be able to show the EVENT date in the carousel module.

Before I go code hunting, I thought I’d ask if you might have some insight on the best way to do this.

Thanks for your help!

2

Hey Keith,

Just letting you know that we are looking into this and will get back to you shortly.

Thanks!

KC

3

Hey Keith! Cool mashup!

I believe this is doable with a custom module. You could probably “fork” our post carousel module into a custom module. Then you could tweak the query so it utilizes the Events Calendar fields (i.e., event date). It will take some development work.

Here’s our documentation on Custom Modules:
http://forum.wpbeaverbuilder.com/custom-module-documentation/

Hope that helps. Let me know if you have any other questions. :slight_smile:

4

Kieth, my apologies, I take that back. On closer look, the loop settings are separate from the module, so it won’t be as easy to override. I hate to say it, but this might not be doable at this time.

You could try searching for another Carousel plugin that integrates with Events Calendar Pro.

5

I think I found a solution - Meta Slider Pro apparently integrates directly with The Events Calendar Pro and offers a post slider option.

https://www.metaslider.com/meta-slider-pro-integrates-with-the-events-calendar-in-2-4-6/

6

Meta Slider Pro is ok, but not great. The biggest problem is isn’t truly responsive and getting the settings just right is becoming a PITA.

If anyone else wants to upvote this feature request, here it is:

https://wpbeaverbuilder.uservoice.com/forums/270594-general/suggestions/11303409-events-in-post-carousel

7

I was just looking at this now - the built in post carousel already has the ability to show events, all that’s really necessary (as indicated in the Feature Request) is the ability to ‘order by event date’.

Seems like an easy implementation, yeah?

And does the loop already collect the event date? If so, forking the module should work since all that would be needed is to replace the post date display with the event date.

Thoughts?

8

I thought I found a temporary solution, but it’s not working.

Below is what I originally posted as a possible solution, but that’s actually not the case. I’m leaving it here in the hopes that someone could take a look at what I was trying to do and help shed some light on what’s going wrong. I suspect that the loop isn’t picking up the ‘tribe_get_start_date’, but I’m unclear as to where to look for or change that.

I’ll keep digging through the docs to see if I can find the answer…

Follow the Override Custom Module section:

http://forum.wpbeaverbuilder.com/custom-module-documentation/#override-built-in

and create the fl-builder>modules folders in your child theme folder, then copy the ‘post-grid’ folder to the 'fl-builder>modules folder you created in your child theme folder.

Open the ‘post-grid.php’ file from within the post-grid>includes folder that you just copied to your child theme folder and, on line 35, change this:

<?php echo the_time('Y-m-d'); ?>">

to this:

<?php echo tribe_get_start_date('Y-m-d'); ?>">

Here’s a copy of some of the section before and after the section of code you’ll want to change, for reference:

<?php if($settings->show_date) : ?>
				<?php if($settings->show_author) : ?>
					<span> | </span>
				<?php endif; ?>
				<span class="fl-post-feed-date" itemprop="datePublished" datetime="<?php echo tribe_get_start_date('Y-m-d'); ?>">
					<?php FLBuilderLoop::post_date($settings->date_format); ?>
				</span>
			<?php endif; ?>
		</div>
9

Found the temporary solution.

NOTE! This ONLY works if you use the Post Grid layout and ONLY for Events! If you try to use the Post Grid anywhere else, or try to include Blog posts, it all goes south…

Here’s the updated instructions:

Follow the Override Custom Module section:

and create the fl-builder>modules folders in your child theme folder, then copy the ‘post-grid’ folder to the ‘fl-builder>modules folder you created in your child theme folder.

Open the ‘post-grid.php’ file from within the post-grid>includes folder that you just copied to your child theme folder and, on line 35, change this:

<?php echo the_time('Y-m-d'); ?>">

to this:

<?php echo tribe_get_start_date(); ?>">

And change line 36 from this:

<?php FLBuilderLoop::post_date($settings->date_format); ?>

to this:

<?php echo tribe_get_start_date(); ?>

I also change the schema.org items to properly reflect the correct Event properties.

Here’s a copy of some of the section before and after the section of code you’ll be changing, including the schema changes, for reference and to easily copy/paste it:

<?php endif; ?>
			<?php if($settings->show_date) : ?>
				<?php if($settings->show_author) : ?>
					<span> | </span>
				<?php endif; ?>
				<span class="fl-post-feed-date" itemprop="doorTime" DateTime="<?php echo tribe_get_start_date(); ?>">
					<?php echo tribe_get_start_date(); ?>
				</span>
			<?php endif; ?>
10

Thanks Keith, for sharing. I’m sure some of our users will find this very useful.

Thanks,
Danny