CAL: A school event list widget

Jan 23, 2018

You can configure a short event list for display on your school’s home page.  The idea is appealing to many schools, however with so many different page themes to contend with we needed to implement this with the flexibility to handle anything the school’s web designer would throw at us.

For this reason we publish the data in a plain XML format and then offer an XSLT document to style the data into the form and look required by the school.

The XML data

The simplest way to present this is with an example containing just one event.  Normally you would have a number of events repeated in this data:

<sobs-calendar-events>

<event-list limit=’10’ from=’19-09-2011′>

<event>
<category>Special events</category>
<description>Swimming carnival</description>
<timestart>25-10-2011 8:40am</timestart>
<timeend>25-10-2011 2:45pm</timeend>
<contactphone>0455 555 333</contactphone>
<contactemail> coach@acme.edu.au</contactemail>
<contactname>Coach Tim</contactname>
</event>

</event-list>

</sobs-calendar-events>

Enable this function and locate the URL

  1. Login to the SOBS School Calendar application as a SOBS administrator
  2. Go to the ‘School Settings’ page
  3. Click on the ‘CAL’ tab
  4. Click the ‘Edit’ button (top right)
  5. Click on the ‘Public view’ option (if it is not already enabled) and then click ‘Save’
  6. This should display the various ‘Public view’ options including the Event list URL

You can now copy that URL and place it in a frame on your school’s home page.  If you are not sure what a frame is you may need to get some help from a web designer or http://www.w3schools.com

Event list URL options

The “schoolid” option is required and must reflect the default URL displayed.

You can also add a “limit” option to limit the number of events displayed.  For example: http://sobs.com.au/cal/events2xml.php?schoolid=9&limit=6   – this would limit the number of events displayed to six.

Formatting the event list for your School

We apply a default XSLT document to the XML data described above to create the default layout.  You can view this layout by entering the Event list URL into your browser – the list of events will be displayed using the default template.

NOTE: You will need some knowledge of coding HTML in order to complete this process

To modify the template for your school:

  1. Login to the SOBS School Calendar application as before and make your way to the ‘CAL’ tab
  2. Click the ‘Edit’ button (top right)
  3. When the detail is displayed there will be a text area called “XSLT event list”.  The content of the template can be typed into this box.  You may not be sure what to type – I know I wasn’t the first time, so keep reading…
  4. In the help text under the text area you will find a link to the default XSLT document we use, click this link to open this document – it should open in a new window and display the XSLT template code (a bit like HTML).
  5. Copy the content of this document (you may need to use your web browser’s ‘View source’ option)
  6. Switch back to the previous browser window and paste the content into the text area
  7. You can now begin making small changes to the template
  8. Click ‘Save’ to save these changes and then open a browser window using the Event list URL to view your changes applied to the data
  9. Repeat steps 7 & 8 to continue making changes to the XSLT document and viewing the new results until you are happy with the look of the event list