Event Calendar

Best Practices


The event calendar provides an engaging way to inform site visitors of upcoming events. The static image below shows a calendar landing page. The site visitor can click on a “Details” link to get more information and add the event to his or her calendar.  To interact with a “live” calendar, see the example at the bottom of this page.

example event calendar
Go to Examples


  • By default, a WCMS event calendar displays all events published on the site. Using event categories, you can create multiple calendar modules on a site, with each calendar showing a subset of events based on event categories. For more information on event categories and managing multiple calendars, see “Building in the WCMS.”
  • By applying event categories to events, you can give calendar users the option of filtering events by category.
  • Plan to use the full page width for the calendar. (The events on the calendar are auto-formatted.  To create an event, a WCMS user completes a form with venue, POC, and other details. For more information, see Building in the WCMS.)
  • For each event, pick an engaging high-quality image. Avoid images with words.  (Event images are optional, but they help visitors scan the calendar and they engage visitors.)
  • There are no hard-fast rules for image aspect ratio, but 4:3 works well. Minimum size for optimal display is 400×300.
  • Use a brief, direct title for each event. Save the details for the description.
  • In the description, include key information in first two to three sentences.
  • Include a full address in the event address fields.  This allows mobile devices to link directly to a map application.

Example Calendar

Note that the calendar below has a background shade applied to the Visual Composer row.  This helps to hold the large content element together visually.