Modifying the Event Calendar HTML

Home > Tutorials

The event calendar, as with most other part of Events Manager, can be modified using template files. By adding a specific file to your theme folder which overrides the default calendar format, you can use the information passed on by Events Manager to generate the calendar to your exact specifications.

There are two files for calendars, both which are located within the templates/templates folder:

• calendar-full.php – This is the full calendar, which is called if you modify your Event Page settings or use full=1 in shortcodes or ph functions.
• calendar-small.php – This file is used to generate widgets and default calendars where the full=1 attribute was not passed.

There are two variables which are made available to you inside both files:

• $calendar – contains an array of information regarding the calendar and is used to generate the content
• $args – the arguments passed to EM_Calendar::output() and was used by EM_Events::get() to retrieve the correct event information

$calendar looks something like this (this is not PHP, just the summarized result of a print_r statement):

Array(
	[cells] => Array(
		[2011-03-28] => Array(
			[date] => 1301270400
			[type] => pre
			[link_title] => Event Name
			[link] => http://mysite.com/events/2011-03-28/
			[events] => Array (
				[0] => EM_Event Object
			)
		)
		[2011-03-29] => Array	(
			[date] => 1301356800
			[type] => pre
		)
		[2011-04-01] => Array	(
			[date] => 1301616000
		)
		[2011-04-02] => Array	(
			[date] => 1301702400
			[link_title] => Event Name 1, Event Name 2, etc.
			[link] => http://mysite.com/events/2011-04-02/
			[events] => Array (
				[0] => EM_Event Object
				[1] => EM_Event Object
				etc.
			)
		)
		.....
		[2011-04-30] => Array (
			[date] => 1304121600
		)
		[2011-05-01] => Array	(
			[date] => 1304208000
			[type] => post
			[link_title] => Event Name 1, Event Name 2, etc.
			[link] => http://mysite.com/events/2011-05-01/
			[events] => Array (
				[0] => EM_Event Object
				[1] => EM_Event Object
				etc.
			)
		 )
	)
	[month_start] => 1301616000
	[month_next] => 5
	[year_next] => 2011
	[month_last] => 3
	[year_last] => 2011
	[links] => Array(
		[previous_url] => ?ajaxCalendar=1&month=3&year=2011&
		[next_url] => ?ajaxCalendar=1&month=5&year=2011&
	)
	[row_headers] => Array (
		[0] => M
		[1] => T
		[2] => W
		[3] => T
		[4] => F
		[5] => S
		[6] => S
	)
)

$calendar[‘cells’] will contain an array with the exact number of days required to fill a calendar grid format. Each array item has a yyyy-mm-dd date key and can contain various attributes:

• date (required) – This is a unix timestamp of that date.
• type – The type of date which can consist of three possible values, pre, post and today, which if present means that this day in question falls in the previous month, next month or today respectively
• link_title – The title of the anchor tag linking to the calendar day page.
• link – The link to the full list of events that day.
• events – An array of EM_Events which occur on that day.

Aside from the individual day information, some more variables are passed on to aid in making this calendar work.

• month_start – timestamp for the first day of the month
• month_next – next month number value (1-12)
• year_next – next year number value (e.g. 2011)
• month_last- next month number value (1-12)
• year_last– next year number value (e.g. 2011)
• links – An array of the previous and next links
• row_headers – Array of calendar column header names for $calendar[‘cells’] which will always divide evenly by the number of row_headers

Using the above information, you can determine everything you need to display custom calendars, or just make minor changes to the current calendar templates. Simply copy either or both calendar templates to your theme folder as instructed here and make your changes.