Need help installing Zap Calendar? Click here for a tutorial on installing Zap Calendar, or find out how to add additional functionality to your Zap Calendar site with the dozens of add-ons available for Zap Calendar.

The Upcoming Events Module

Module Name: Upcoming Events

Availability: zlite zbasic Zap Calendar Standard Zap Calendar Pro

 

Purpose: The Upcoming Events module displays a list of upcoming events in a module.  There are several styles and dozens of variations available.

zcalendar upcoming

 

Configuration:

Use the following module settings to configure your upcoming events module:

Select a calendar: Choose a calendar to specify which events and theme to use for the upcoming events

Upcoming Type: Select days, weeks or months

Upcoming Number: used with Upcoming Type to determine how far into the future to show upcoming events. Example Upcoming Type: weeks, Upcoming Number: 2 will show up to 2 weeks of upcoming events

Max # of Events: Do not display more than this # of events in the module. Use "0" to show all events in the given range.

Upcoming Start: Choose "Starting Today" or "Starting Now".  Selecting "Starting Now" will not show events that have occurred earlier today.

Show End Time: When enabled, the end time will be displayed for meetings, i.e. "12pm - 1pm"

Show Date: When enabled, the date of the event will be displayed.  The date is always displayed for multi-day events.

Date Format: The formatting of the date when "Show Date" is enabled.  It can either be in the date format for PHP's gmdate() or strftime() functions.  Two short formats to consider are  "%m/%d" or "%d.%m", where %m is the 2 digit month and %d is the 2 digit day of the month.

Display format: Zap Calendar provides 9 display formats for upcoming events (note: Zap Calendar Lite has only one display format, "default"):

  • Default - a simple list of events
  • Fancy - displays a calendar icon using the calendar's theme color
  • Fancy Color - same as "fancy" using the category color
  • Fancy Box - displays a box surrounding the calendar icon and event details using the calendar's theme color
  • Icon - combines the category color with the event icon to create the calendar icon
  • Plain - displays a minimalist calendar icon using the calendar's theme color
  • Plain Color - same as "plain" using the category color
  • Round - displays a round calendar icon using the calendar's theme color
  • Round Color - same as "round" using the category color

Footer Text: This text will be displayed at the bottom of the module.

Footer URL: When combined with Footer Text, a hyperlink can be added at the bottom of the module. For example, the footer text "Full Calendar" combined with the URL can redirect a user to the calendar page.

Footer Target: Used with the footer text and footer URL, this is the "target" attribute for a hyperlink.

Module Class Suffix: This option, along with the display format option, can generate dozens of variations of display styles.  The following class suffix options are supported:

  • border - This option creates a border around the calendar icon, supported by the plain and round format styles.
  • horizontal - (new in version 4.1.1) This option will display the upcoming events in a horizontal list instead of a vertical list.
  • large - This option creates a larger calendar icon.
  • no-repeat-icon - (new in version 4.1.1) When used, this option will only display the calendar icon for the first event of the day.
  • shadow - This option creates a shadow behind the calendar icon to create a 3D effect.
  • upper - This option displays the icon's month text in uppercase letters.

 

upcomingclass

 

These classes can be combined by separating them with a space.  For example, "shadow large" will create a large icon with a shadow behind it.  You will need to preceed the first class option with a space.

Below is a side-by-side example of some of the display formats:

upcoming

Additional layouts are possible through customization (see the "Customizing Zap Calendar" article for more information).