dateonly (instead of ‘timeonly’)

  • Resolved nikkel

    (@nikkel)


    7 years, 7 months ago

    There is the shortcode option (timeonly=’true’) to display only the TIME of an event. I would like to display only the DATE of an event on a page listing events (but keep the start and end times for when you click to see ‘more details’). So what I want is a ‘dateonly’ shortcode function. Ideally I would like to be able to select a date format so I could display the 3-letter abbreviation for the month names (I can do that using jQuery to shorten month names to display only the first 3 characters, but a shortcode option would be a better way to do that).

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author Brian Hogg

    (@brianhogg)

    Hi @nikkel!

    There is a tutorial here for adding additional HTML around the date and time separately, so that you could hide it using a bit of CSS:

    https://eventcalendarnewsletter.com/change-color-style-time-events-calendar-shortcode/

    The format for the date is under the Events > Settings for The Events Calendar itself (under the Display tab). You’d change F j to M j and that should do the trick.

    Hope that helps!

    Thread Starter nikkel

    (@nikkel)

    Thanks for this. This gets me close to what I need. I can hide the time using CSS.
    I still need a bit of help with events that span more than one day. If I hide the timerange_separator so I don’t get “AUG 16 -” for single-day events, I end up with “AUG 3, 2018AUG 6, 2018” (NO separator) for multi-day events. Also, as you see in my example, the startdate year shows up in multi-day events where the year is not THIS year. (It formats the date range ‘correctly’ for multi-day events coming up THIS year.)

    (see my example ‘Upcoming Events’ here: https://mhv.psone.ca/

    Plugin Author Brian Hogg

    (@brianhogg)

    You’re right, it looks like CSS-only won’t really work. You can play around with the code in that blog post to display things how you want (ie. in the if ( tribe_event_is_multiday( $event ) ) part for multiday events), or else create a custom template to output the exact HTML you need.

    Thanks!

    Thread Starter nikkel

    (@nikkel)

    Got it. Thanks for your help.
    FWIW, here’s how I edited your plugin:

    	$d1 = strtotime($start_date_full);
	$d2 = strtotime($end_date_full);

	$inner .= formatDateRange($d1, $d2);
// Calculate the date range
function formatDateRange($d1, $d2) {
	$startThisYear = $startEndYear = '';
	if (date( 'Y' ) === date('Y', $d1)) {$startThisYear = 1;}
	if (date( 'Y' ) === date('Y', $d2)) {$endThisYear = 1;}
	#event starts THIS year

    if (date('Y-m-d', $d1) === date('Y-m-d', $d2)) {
        # Same day
        if ($startThisYear === 1) {
	        return date('M j', $d1);
	        } else {
		        return date('M j, Y', $d1);
	        }
    } elseif (date('Y-m', $d1) === date('Y-m', $d2)) {
        # Same calendar month
        if ($startThisYear === 1) {
	        return date('M j', $d1) . date(' - j', $d2);
	        } else {
		        return date('M j', $d1) . date(' - j, Y', $d2);
	        }
    } elseif (date('Y', $d1) === date('Y', $d2)) {
        # Same calendar year
        if ($startThisYear === 1) {
	        return date('M j', $d1) . date(' - M j', $d2);
	        } else {
		        return date('M j', $d1) . date(' - M j, Y', $d2);
	        }
    } else {
        # General case (spans calendar years)
        return date('M j, Y', $d1) . date(' - M j, Y', $d2);
    }
}
Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘dateonly (instead of ‘timeonly’)’ is closed to new replies.