Sometimes the next month’s first few days appear on the Month View calendar, depending on how each month is structured. If you’d like, you can remove these dates by adding a PHP snippet on your site and then using custom CSS added to your theme’s stylesheet. We’ll provide you with the snippets you need to make this happen.

remove next month's dates from calendar

The PHP snippet

First, you’ll need to add the following PHP snippet on your functions.php theme file or using the Code Snippets plugin:

add_filter(
	'tribe_events_views_v2_view_month_template_vars',
	function( $template_vars, $view ) {
		// current time.
		$now = Tribe__Date_Utils::build_date_object( $template_vars['now'] );
		// requested date - for month view this is the first of the month.
		$request_date = $template_vars['request_date'];
		
		// if requested date isn't the same as the current date
		if ( $now->format( 'Y-m-d' ) !== $request_date->format( 'Y-m-d' ) ) {
			// pass the requested date as the current date
			$template_vars['today_date'] = $template_vars['request_date']->format( 'Y-m-d' );
		}
		
		return $template_vars;
	},
	10,
	2
);

This snippet is needed to make sure that hiding the respective days works in other months as well, not only the current one.

The CSS Snippet

There are a few different ways to add custom CSS to your WordPress site. For more information on how to do that, check out this Knowledgebase article.

To remove the next month’s dates from the calendar, use this CSS snippet:

.tribe-events-calendar-month__day--next-month div  {    
     visibility: hidden !important;
}

To remove the previous month’s dates from the calendar, use this snippet:

.tribe-events-calendar-month__day--past-month div {
    visibility: hidden !important;
}

And, to remove both the previous month and upcoming month dates from the calendar, use this snippet:

.tribe-events-calendar-month__day--past-month div,
.tribe-events-calendar-month__day--next-month div  {    
     visibility: hidden !important;
}