Display Actual Times on the Filter Bar -> Time section

[Erin]

My client would like to show the actual times in the Filter bar, for example

Morning (8 am – 12 pm)
Afternoon (12pm – 5pm)

etc etc.

Is there a way to do this? If not, I was thinking of just inserting with Javascript. But, I can’t seem to locate what the actual times are. Could you tell me?

Should be for

All Day
Morning
Afternoon
Evening
Night

Thanks!!

Erin

[Cliff]

Hi Erin.

The Time of Day filter comes from this file: /wp-content/plugins/the-events-calendar-filterbar/src/Tribe/Filters/Time_Of_Day.php

You could customize the wording via gettext hooks for these: http://cl.ly/3B3E2v2d2h24 (screenshot from the file mentioned above)

Please reference Change the wording of any bit of text or string and let me know if you have any follow-up questions.

[Erin]

Thanks so much. I ended up just using jQuery to insert the times.

/* Add Specific Times to Time Filter
 ==========================================================*/
		 
if( $('#tribe_events_filter_item_timeofday').length > 0 ){
		
    var morning = $('#tribe_events_filter_item_timeofday input[value="06-12"]').next('span');
    var afternoon = $('#tribe_events_filter_item_timeofday input[value="12-17"]').next('span');
    var evening = $('#tribe_events_filter_item_timeofday input[value="17-21"]').next('span');
    var night = $('#tribe_events_filter_item_timeofday input[value="21-06"]').next('span');

    var morningText = 'Morning (6 a.m. - 12 p.m.)';
    var afternoonText = 'Afternoon (12 p.m. - 5 p.m.)';
    var eveningText = 'Evening (5 p.m. - 9 p.m.)'; 
    var nightText = 'Night (9 p.m. - 6 a.m.)';
			
    morning.text(morningText);
    afternoon.text(afternoonText);
    evening.text(eveningText);
    night.text(nightText);
}

[Cliff]

Thanks so much for sharing!

[Author]

Posts