Skip to content

Instantly share code, notes, and snippets.

@sethshoultes sethshoultes/custom-calendar.html Secret
Last active Dec 10, 2015

What would you like to do?
Event Espresso API w/ Full Calendar Example
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "">
<link rel='stylesheet' type='text/css' href='cupertino/theme.css' />
<link rel='stylesheet' type='text/css' href='fullcalendar/fullcalendar.css' />
<link rel='stylesheet' type='text/css' href='fullcalendar/fullcalendar.print.css' media='print' />
<script type='text/javascript' src='jquery/jquery-1.8.1.min.js'></script>
<script type='text/javascript' src='jquery/jquery-ui-1.8.23.custom.min.js'></script>
<script type='text/javascript' src='fullcalendar/fullcalendar.min.js'></script>
<script type='text/javascript'>
$(document).ready(function() {
events: "json-events.php",
/*eventSources: [
theme: true,
cache: false,
lazyFetching: true,
header: {
left: 'prev,next today',
center: 'title',
right: 'month,agendaWeek,agendaDay'
loading: function(bool) {
if (bool) $('#loading').show();
else $('#loading').hide();
<style type='text/css'>
body {
margin-top: 40px;
text-align: center;
font-size: 14px;
font-family: "Lucida Grande",Helvetica,Arial,Verdana,sans-serif;
#loading {
position: absolute;
top: 5px;
right: 5px;
#calendar {
width: 900px;
margin: 0 auto;
<div id='loading' style='display:none'>loading...</div>
<div id='calendar'></div>
<p>This page is using the Event Espresso API</p>
header('Content-type: text/json');
$curdate = date("Y-m-d H:i:s");
$url = "".urlencode($curdate);
//Retrieve the data
$json = file_get_contents($url, true); //getting the file content
$decode = json_decode($json, true); //getting the file content as array
$count = count($decode['body']['Events']); //counting the number of results
echo '[';
$separator = "";
if ($count > 0){
foreach ($decode['body']['Events'] as $event){
echo $separator;
echo '{"title": "'.$event['name'].'", "start": "'.date('Y-m-d',strtotime($event['Datetimes'][0]['event_start'])).'", "end": "'.date('Y-m-d',strtotime($event['Datetimes'][0]['event_end'])).'", "url": "'.$event['id'].'"}';
$separator = ",";
echo ']';

This comment has been minimized.

Copy link
Owner Author

sethshoultes commented Jan 4, 2013

This is a quick example. You will need to have the latest version of FullCalendar ( installed on your server.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.