Changing meta field labels

In this post we're going to look at modifying the names of various labels in the single event meta area. This is the section of the page that typically sits below the event description and lists things such as time, cost, any tags or categories and other information (such as details of the venue or organizer).

Screenshot showing the single event meta area

While the default labels work well in most cases, changing them can help you to craft a more intuitive experience for your visitors. In this post we'll pick on two different fields, each of which require a slightly different approach:

  • First, we'll change the website label to learn more, visit
  • Then, we'll change event categories to find similar events

Regular labels

The website field is a great example as the same strategy can be used for many of our other fields, too.

Our first task is to setup a template override for the the-events-calendar/src/views/modules/meta/details.php template — details on this process are described in full within the Themer's Guide—then, within your custom copy, locate the following line:

<dt><?php esc_html_e( 'Website:', 'tribe-events-calendar' ) ?> </dt>

This is the code that displays the "Website:" label. In most cases, we don't even need to keep those PHP tags—instead, we can change it as follows:

<dt>To learn more, visit: </dt>

It's a clean, easy change that can also be applied to the labels for most of the other fields as well.

Category label

There are a few special cases where the above approach will not work, however, and one of these is the category field. Within the same template, look for the following chunk of code:

<?php
echo tribe_get_event_categories(
	get_the_id(), array(
		'before'       => '',
		'sep'          => ', ',
		'after'        => '',
		'label'        => null, // An appropriate plural/singular label will be provided
		'label_before' => '<dt>',
		'label_after'  => '</dt>',
		'wrap_before'  => '<dd class="tribe-events-event-categories">',
		'wrap_after'   => '</dd>'
	)
);
?>

This displays the list of categories—but where is the label? It's actually this single line found within the above chunk of code

'label' => null, // An appropriate plural/singular label will be provided

This simply tells The Events Calendar to use a default label (which magically changes depending on where there is just one category or several categories). To specify our own label, though, all we need to do is change that line to:

'label' => 'Find similar events',

Be sure to keep the final comma in place! With those changes in place, we should now see:

Screenshot showing customized meta labels

We hope that gives some insights into customizing the single event meta fields. As ever, do feel free to approach us at our help desk should anything be unclear :-)