Function: Displays a Trumba calendar based on “name” and “type”.
Number of options: 1 main type (required), 10 control types (optional), and 12 alternate display types (optional).
Step 1: Create main calendar view
To display any calendar, you must create a page with the main calendar view on the page. This view will display all of the calendar’s upcoming events. This view will also be used to display individual events. To use this main calendar, create a new page within your site and add the following code:
**Note: Copy all of the code, including the [ ] on either end.
[trumba name="sea_campus" type="main" base="/docs/shortcode-cookbook/trumba/"]
Required attributes
- name: name of the of the calendar you want to use.
- ex) To use the main Seattle Campus calendar, the name would be “sea_campus”. If you need help determining the name of your calendar, please contact UWIT.
- type: name of the view or control you wish to use.
- **Note: In some circumstances, you will hear “type referred to as a “spud” – “spud” is Trumba’s name for these.聽
- base: the URL of the page you are placing your calendar on, or another page with Trumba calendar on it (this is not very common).
Step 2: Customize calendar controls
Skip to Step 3 (optional): Alternate display types
The following 10 short codes will help your users navigate your calendar. These controls will allow users to change views, dates, search for events, and more. They can be used in any combination, but must be used with the main calendar view.
Some controls can be placed on top of the main calendar view; however, in many cases, content authors will want choose to create a two column layout, using the grid shortcode, with the main calendar in a large column and controls in the small column.
Jump to:
Option 1: Change the view of the main calendar
Option 2: Change the date and time of the main calendar
Option 3: Change the date and time of the main calendar
Option 1: Change the view of the main calendar
View chooser, tabbed
This control will allow the user to change the view between a list of events, a summary of events, or tiles of events.
**Layout best practice: This would be best placed above the main calendar view.
[trumba name="sea_campus" type="tabchooser" base="/docs/shortcode-cookbook/trumba/"]
View chooser
This control will allow the user to change the view between a list of events, a summary of events, or of events by using a dropdown menu.
**Layout best practice: this would be best placed in a smaller column next to the main calendar view.
[trumba name="sea_campus" type="chooser" base="/docs/shortcode-cookbook/trumba/"]
Option 2: Change the date and time of the main calendar
Month list
This will change the main calendar view to show events corresponding to the specific month the user clicked.
**Layout best practice:聽this would be best placed above the main calendar view.
[trumba name="sea_campus" type="monthlist" base="/docs/shortcode-cookbook/trumba/"]
Date finder
This will change the main calendar view to show events corresponding to the specific date the user clicked.
**Layout best practice: this would be best placed in a smaller column next to the main calendar view.
[trumba name="sea_campus" type="datefinder" base="/docs/shortcode-cookbook/trumba/"]
Go to date
This control will allow the user to search for a specific date to display events.
**Layout best practice:聽this would be best placed in a smaller column next to the main calendar view.
[trumba name="sea_campus" type="gotodate" base="/docs/shortcode-cookbook/trumba/"]
Timezone picker
This control will allow the user to change the聽timezone to their preference.
**Layout best practice: this聽would be best placed in a smaller column next to the main calendar view.
[trumba name="sea_campus" type="timezone" base="/docs/shortcode-cookbook/trumba/"]
Option 3: Allow users to search for events
Search
This control will allow the user to search for events that match a search query.
**Layout best practice: this would be best for a smaller column next to the main calendar view聽
[trumba name="sea_campus" type="searchlabeled" base="/docs/shortcode-cookbook/trumba/"]
Location search
This control will allow the user to search for events taking place in specific locations.
**Layout best practice: this would be best for a smaller column next to the main calendar view.聽
[trumba name="sea_campus" type="locationsearch" base="/docs/shortcode-cookbook/trumba/"]
Calendar list
This control will allow the user to聽chose聽to view a specific sub-calendar or all sub-calendars. Use this only if your calendar聽contains聽sub-calendars and/or displays multiple calendars.
**Layout best practice: this would be best for a smaller column next to the main calendar view.聽
[trumba name="sea_campus" type="mix" base="/docs/shortcode-cookbook/trumba/"]
Filter
This control will allow the user to display one time events or on-going events.
**Layout best practice: this would be best for a smaller column next to the main calendar view.聽
[trumba name="sea_campus" type="filter" base="/docs/shortcode-cookbook/trumba/"]
Step 3 (optional): Alternate display types
In addition to the main calendar view, there are several additional views to choose from. These views can be used by themselves, with the main calendar view, and/or with any of the calendar controls.
- Day summary
- Event slider
- Upcoming events
- Photo upcoming
- List by month upcoming
- Upcoming date table
- Upcoming events crawler
- Upcoming fader list
- Upcoming grouped
- Upcoming preview
- Upcoming table
- Upcoming vertical crawler
Day summary
Displays a list of the events occurring on a specific day. Includes timestamps and links to the event.
[trumba name="sea_campus" type="daysummary" base="/docs/shortcode-cookbook/trumba/"]
Event slider
Displays a carousel of events.
[trumba name="sea_campus" type="eventslider" base="/docs/shortcode-cookbook/trumba/"]
Upcoming events
Displays a list of upcoming events. Includes the link to the event, the time, and the location.
[trumba name="sea_campus" type="upcoming" base="/docs/shortcode-cookbook/trumba/"]
Photo upcoming
Displays a list of upcoming events with an image associated for each event. Includes the link to the event, the time, and the location.
[trumba name="sea_campus" type="upcomingphoto" base="/docs/shortcode-cookbook/trumba/"]
List by month upcoming
Displays a list of upcoming events for a specific mont, ordered chronologically by the day of the month. When hovering over a link, details will appear to the right of the link.
[trumba name="sea_campus" type="listbymonthupcoming" base="/docs/shortcode-cookbook/trumba/"]
View list by month upcoming example
Upcoming date table
Displays a table view of upcoming events, chronologically ordered by date. The date of the event is the first column, and the link to the event is the second column. When hovering over a link, details will appear to the right of the link.
[trumba name="sea_campus" type="upcomingdatetable" base="/docs/shortcode-cookbook/trumba/"]
View upcoming date table example
Upcoming events crawler
Displays a single line banner that animates the event title and date crawling across the screen.
[trumba name="sea_campus" type="crawler" base="/docs/shortcode-cookbook/trumba/"]
View upcoming events crawler example
Upcoming fader list
Displays a list of upcoming events that shows 5 events at a time, then fades into another 5 upcoming events.
[trumba name="sea_campus" type="upcomingfader" base="/docs/shortcode-cookbook/trumba/"]
View upcoming fader list example
Upcoming grouped
Displays a list of upcoming events, with the event details linked to the date and time.
[trumba name="sea_campus" type="upcominggrouped" base="/docs/shortcode-cookbook/trumba/"]
Upcoming preview
Displays a list of the month’s upcoming events, and includes a short description of the event.
[trumba name="sea_campus" type="upcomingpreview" base="/docs/shortcode-cookbook/trumba/"]
Upcoming table
Displays a table of upcoming events, categorized by event name, date, and the time.
[trumba name="sea_campus" type="upcomingtable" base="/docs/shortcode-cookbook/trumba/"]
Upcoming vertical crawler
Displays a list of upcoming events (includes the event link, date, location, and picture) on a vertically moving banner.
[trumba name="sea_campus" type="upcomingvcrawler" base="/docs/shortcode-cookbook/trumba/"]