Display a List of Upcoming Events

You are here:

Member Splash uses a calendar plugin called Event Organiser (European spelling). It provides a couple of options for displaying lists of upcoming events on your site.

Widgets

The first method is by using one of the Widgets that come with the plugin. Widgets are just blocks of content that can be displayed on your site. They typically come with a handful of settings for filtering the content displayed and controlling the output.

The Events widget is documented here: http://docs.wp-event-organiser.com/widgets/events-list/

In the documentation it explains that you can control the appearance of the events in the list via a template field. The template field accepts placeholders that function like merge tags in a Word doc — they get replaced with the actual value from the event.

For example: %event_title% would be replaced with the title of the event.

The placeholder for dates accepts optional values that specify the format the date should be displayed in. The date format options can be found here: http://php.net/manual/en/function.date.php

Finally, the template field accepts HTML tags for creating links, bolding text, etc.

An example of using the template field to format the list of events so they look like the image below:

<b>%start{l, M  d}%</b>: <a href=’%event_url%’>%event_title%</a>

Broken down:

  • <b> = HTML tag for starting bold text
  • %start = the template tag for the start date & time of the event
  • {l, M d} = the format to use in displaying the start date & time. In this case using the full day name (l), the abbreviated month name (M) and the numeric day of the month (d)
  • %</b> = signals the end of the template tag and the bold text
  • <a href=” = the HTML tag for a hyperlink
  • %event_url% = the URL of the event listing
  • ‘> = the end of the URL to link to
  • %event_title% = the text to display (what you will click), in this case the event title
  • </a> = the end of the link

Shortcodes

Shortcodes are snippets of text inside left and right brackets that WordPress can use to display dynamic content like a list of upcoming events. When a page with a shortcode is loaded WordPress reads the code and replaces it with the generated content.

Event Organiser provides a shortcode that has the same functionality as the widget above. You can use it to place a list of events on any page by adding the shortcode to the page content

The directions are here: http://docs.wp-event-organiser.com/shortcodes/events-list/

The shortcode accepts values that control which events are displayed and how they are formatted, just like the widget does.