University at Buffalo - The State University of New York
Skip to Content
UB Web Management

Transforming UB’s digital communications through process and tools

Event List Component

Display events from the UB Calendar of Events on your page.

Component as it first appears on the page.

Component as it first appears on the page.

This is a handy way to promote your future events, or events up to a year in the past, but is not intended to be an interactive calendar.  The list can be free-floating (displaying a set number of days in the past-future) or use a fixed date-time range.

Using This Component

Add the component to the page. When it first loads, the default message "No events scheduled" is displayed.

There are three initial tabs: Module, Event Selection and List Items. A Search tab appears after the Build list using Search option is chosen.

Split long lists onto several pages.

Lists with more than 500 teasers will generate a server error and not show any results. More details are in this Known Issue.

Module Tab

Title: Assign a suitable heading for your events feed.  In our example, we used "Sustainability Events."

Events links: This controls where someone will be taken when they click on an item in the feed. Choose between:  

  • always link to the UB Events calendar 
  • link directly to the Event website (when available)
    • This choice bypasses any details placed in the calendar entry.

"No events text": Display a custom message when there are no events.
By default "No events scheduled" will be displayed.

Show feed icon: Display a small RSS icon in the upper right.

Feed page: Set the link for the feed icon. In most cases can be left blank to link to a feed of the events shown in the component

Show "See All" button: Add a way for people to browse all your events.

"See All" button text: Customize the "See ALL" button text.

"See all" button link: Customize where the "See All" link goes.

This component opened for editing, showing the Module tab.

This component opened for editing, showing the Module tab, with an example title of "Sustainability Events".

Event Selection Tab

Date range: Choose between 'Relative date range (default)' and 'Fixed date range'. Relative uses a sliding view based on today's date, while Fixed allows you to set a specific date range. In either mode, events up to one year old can be included.

Relative date range (Disabled when 'Fixed date range' is selected.)

  • Past days: Specify the number of days into the past whose events you wish to show.
    • By default the value is '0' (the current date and time).
      • There is no current way to show today's events that started before the current time without choosing a previous day to start the list.
    • Optionally select a previous day to start the list; '1' is yesterday, '2' is two days ago, and so on. The display will begin with events from the first date in the list.
      • There is currently no 'back in time' navigation.
  • Future days: Specify the number of days into the future whose events you wish to show.
    • By default all available future events will be displayed.

Fixed date range (Disabled when 'Relative date range' is selected.)

  • This option sets a specific date and time for which to show your events and is probably best for promoting an event with a fixed date range.
    • Set a Start date and time. Both are required.
    • Set an End date and time. Both are required.

Past number: Limit the number of past events (not days) that will be displayed.

  • If left blank, the default value of  '0' will be used (today). 
  • Enter a large number if you wish to make an extensive collection available (e.g. 9999).
  • For Relative date range, remember that many days may have more than one event, so Past number should usually be larger than Past days.  

Future number: Limit the number of future events (not days) that will be displayed.

  • If left blank, the default value of '100' will be used. 
  • Enter a large number if you wish to make an extensive collection available (e.g. 9999).
  • For Relative date range, remember that many days may have more than one event, so Future number should usually be larger than Future days.

NB. When the block setting is also used, past events will be gray, today's events will be dark blue, and future events will be light blue.

The component opened for editing, showing the Event Selection tab in its Relative Date Range setting.

The component opened for editing, showing the Event Selection tab in its Relative Date Range setting.

The component opened for editing, showing the Event Selection tab in its Fixed Date Range setting.

The component opened for editing, showing the Event Selection tab in its Fixed Date Range setting.

List Tab

Build list using: For UB Events, you MUST select Search.

New window: Select so each clicked page is displayed in a new browser window.

Display as: The default setting places a large 'calendar' icon beside each event.

  • Events: With Date Block (default)
    • This displays a linked event title, then the date, time and location details.
    • Beside the event details is a large colored square containing the day's date. Past events will be gray, today's events will be dark blue, and future events will be light blue.
  • Events: Without Date Block
    • This compressed format skips the date block, but displays the linked event title, then the date, time and location details. 
  • Events: Without Subtitle
    • This is the same as the date block view except the the 'series title' that normally precedes the actual event name is omited.
  • Events: Without Date Block or Subtitle
    • This compressed format omits the date block and the 'series title'. 
This opened for editing, showing the List tab.

This opened for editing, showing the List tab, with the 'search' option chosen.

Advanced list options

  • Paginate after:  This setting turns on paginated returns, with the maximum number chosen displayed for each page (optional).
    • If left blank, the page will display all entries in the list.
    • If defined, a button labeled Next will appear at the bottom of the list on the first page. The subsequent pages will also include a Previous button until the final page of entries.
  • Exclude current page: Do not display any entries that link to the page on which the list is shown (optional).
This opened for editing, showing the List tab's advanced options.

This opened for editing, showing the List tab's advanced options.

Search Tab

Search query: Enter a predetermined unique keyword or phrase; e.g. "ubgreen-event" in our example. This is optional, but with no keyword you will display ALL events in the calendar.
More complex queries are possible -- see Advanced Use.

Start in: You must enter /content/shared/ubevents .

This component opened for editing, showing the Search tab.

This component opened for editing, showing the Search tab, with the example keyword "ubgreen-event."

Restrictions

  1. You MUST always use the UB Calendar of Events feed
    /content/shared/ubevents  .
  2. Past events are limited to one year.
  3. Events beginning earlier today can only be show by also revealing events from a previous day.
  4. No 'past' navigation is possible. A start date sets the beginning of the list, from where the visitor can onky navigate forward in time, and then back to the initial start date.

Advanced Use - Building a Complex Search Query

These tips should apply to all UBCMS components that provide a 'build by search' option (e.g. List Builder, News List, Event List, Full Width Carousel and the Horizonal and Vertical Slide Decks).  

Search Operators

  • Boolean AND - All words in the search query must be present. A space basically functions as an AND operator.
    e.g. international students, equals "international AND students" and will find pages with both those words present.
  • Boolean OR - Any of the words separated by OR must be present.  Use OR  ("OR" must be capitalized).
    e.g. abc OR def will find pages with abc or with def, or with both words.
  • Boolean NOT - Exclude a word from the search query by preceding it with a dash/minus.
    e.g. abc -def will find pages with abc but exclude those with def.
    For an OR search, be sure to exclude the term from all parts of the search equation.
    e.g. abc -def OR xyz -def will find pages with abc OR xyz but exclude those with def.
  • GROUPING - Use parentheses ( ) to set precedence among your search operators - parenthetical actions occur first.
    e.g. (abc def) OR xyz will find pages with both abc AND def (as described in the AND section), as well as pages with xyz.
  • PHRASE - Threat the words as one alphanumeric string by using double quotes " ".
    e.g. “abc def” xyz - will make abc def be in sequence, and xyz anywhere.
  • DISTANCE - "abc def”^10 will find pages with abc within ten words of def.
  • WILDCARD - Use ?  to match any one character. Use * to match any number of characters respectively. Do not use either wildcard at the beginning of a word.
    e.g. buil? would find pages with build or built but exclude pages with buildings
    e.g. buil* would find pages with build or built or buildings

Searching for Tagged Pages

You can also use the search option to list tagged pages. And the above logical operators allow fairly advanced logic for tagged pages that is not possible using other tools.

  • Each tag has an ID that looks like this: sandbox:admin-services/policy/admin
    • Authors can see it in Page Properties, in the Tags option, by hovering over the tag.
    • Tag Admins can view the ID in the “TagID” column in the Tag Admin interface.
    • This ID is also visible in the page's source (e.g. Right-click + View Page Source).
  • Use the complete ID in your search in quotes and with the logic operators described above.
    • e.g. "content-type:policy" -"sandbox:admin-services/policy/admin" would find pages with the policy tag but exclude those with the admin-services/policy/admin tag.
  • You must fill in the Start in path for this to work. Unless you have something more specific in mind, use “/content”.
  • Search returns will include child tags of the searched tags; e.g. "sandbox:admin-services/policy” also matches the tag sandbox:admin-services/policy/admin
  • If the actual text like "content-type:policy” is on a page, that page will be found, too. Since most punctuation and capitalization are ignored, this could also appear in prose as something like “… the correct content type. Policy says you should …”
  • The search will also find its itself (the search page), since the query is stored in the page. You can prevent this by adjusting the Start in path to exclude the current page (such as searching for shared content only), or by using the Exclude current page checkbox under Advanced options.

Was this page helpful?

(Required)
(Required)
(so we can thank you or request more details)
(Required)
(buffalo.edu addresses only please)

On this page:

Tip: Create a new page using the News and Event List template. This component is added automatically with the correct general settings already in place. You can then copy and paste it onto another page and delete the new page.

See An Example:

Get Your Events into the Calendar

All UB staff, faculty, and students can submit events to the UB calendar. To register as a contributor, click 'Join the Calendar' on the calendar website.

Master Class Resources:

Related Components:

Last Reviewed:

October 22, 2015