How to  add the Event Calendar to the website

1. Create a page for displaying events ("Events", for example).
2. Add the Composite.Lists.EventCalendar page datafolder to the page.
3. Add Events as data items to this datatype by filling in following fields:

• Title: the name of the event (required)
• Short Description: short description of the event
• Description: full description of the event
• Start Date: the starting date of the event
• End Date: the ending date of the event

How to show the details of an event in the calendar

1. On the Content tab of the page, the Markup Code tab of a template used for this page or the Template tab of an XSLT function used on this page, insert the Composite.Lists.EventCalendar.Detail function ( Insert > Function), or add the following code:
   Expand code

   <f:function name="Composite.Lists.EventCalendar.Detail" xmlns:f="http://www.composite.net/ns/function/1.0"> 
     <f:param name="NumberOfEvents" value="5" /> 
   </f:function>

2. If necessary, specify the following parameter:

• Number of Events: The number of the events to display on the page (3 by default). Change the value type to "Specify a simple value" to override the default value.

How to list events in the calendar

1. From the Content or Layout perspective, insert the Composite.Lists.EventCalendar.List function ( Insert > Function), or add the following code:
   Expand code

   <f:function name="Composite.Lists.EventCalendar.List" xmlns:f="http://www.composite.net/ns/function/1.0"> 
     <f:param name="DisplayMode" value="true" /> 
   </f:function>

2. If necessary, specify the following parameter:

• Display Mode: The type of events to show on a page: the "current and coming events" or the "past events" ("current and coming events" ("true") by default). Change the value type to "Specify a simple value" to override the default value.

Important Notes

1. The past and coming events are displayed not only from the current page's datafolder, but also from other pages, too.
2. The Composite.Lists.EventCalendar.Detail function should be added to the page, to which the Composite.Lists.EventCalendar datafolder has been previously added.

Customization

You can customize the layout by editing the style sheets:

/Frontend/Composite/Lists/EventCalendar/Styles.css