Is it possible to hide past events in month view?

[eventos donosti]

I would like to know if there was a way to hide past events from month view.

It is April 26 now and I see all the events from the month. I would like not to see past events so it is easier to get to the present day.

Is it possible?

[Jeremy]

Hi,

Yes, it’s possible to hide past events from the month view, thanks to a CSS snippet. Try to paste the following code in Appearance > Customize > Additional CSS (or in your child theme’s style.css file):

/**
 * From https://gist.github.com/cliffordp/cc30fba3242c495a26bd/
 * 
 * Hide past events on The Events Calendar's Month View
 * 
 * Without this snippet: http://cl.ly/3x2o3N2K3z1r
 * With this snippet: http://cl.ly/0H431E2L0i17
 * 
 */

.tribe-events-calendar td.tribe-events-past .tribe-events-month-event-title a,
.tribe-events-calendar td.tribe-events-past .tribe-events-viewmore a,
.tribe-events-calendar td.tribe-events-past .tribe-events-viewmore {
	display: none;
}

.events-archive.events-gridview #tribe-events-content table.tribe-events-calendar td.tribe-events-past .type-tribe_events {
	border: none;
	box-shadow: none;
}

You can find more information on this page.

I hope this helps,

Cheers,
Jeremy

[eventos donosti]

The problem is that I have the category color plugin and you can see the colours even with the events hidden (see attached image).

Is there a way to solve this?

[Jeremy]

Hi,

Thank you or this screenshot, I understand better.

Well, to hide those colored past events, maybe you can try to add the following code in Additional CSS (below the previous code I gave you):

.tribe-events-calendar .tribe-events-past .tribe_events {
	background-color: inherit;
}

If that doesn’t work, you could add !important:

.tribe-events-calendar .tribe-events-past .tribe_events {
	background-color: inherit !important;
}

I hope this will solve your issue!

Cheers,
Jeremy

[eventos donosti]

It made the trick with the second one. I achieved what I wanted (past events not to be seen), but when you pass over with the mouse on those dates, the preview still shows up (as per attached image).

I´m quite happy but if we could fix this it would be awesome.

[Jeremy]

Hi,

I’m glad the second trick worked, but it’s not ideal indeed if the rollover still has an effect.

Well, maybe you could try this instead (still in Additional CSS):

.events-archive.events-gridview #tribe-events-content table.tribe-events-calendar td.tribe-events-past .type-tribe_events {
    display: none;
}

Please do let me know if that solved your issue.

Cheers,
Jeremy

[Support Droid]

Hey there! This thread has been pretty quiet for the last three weeks, so we’re going to go ahead and close it to avoid confusion with other topics. If you’re still looking for help with this, please do open a new thread, reference this one and we’d be more than happy to continue the conversation over there.

Thanks so much!
The Events Calendar Support Team

[Author]

Posts