Create calendar and event widgets

To create calendar widgets, go to Calendars > Widgets.

Navigating to the Calendar Widgets page


Types of calendar and event widgets

Full calendar

The full calendar allows you to embed a traditional calendar into a webpage or LibGuide. This allows patrons to browse events by day, either in a monthly, weekly, daily, or agenda view. Hovering over an event will pop up its details, while clicking on an event with take a user to the full page for that event (where they can register, if needed). 

Due to their size, full calendar widgets are ideal for desktop sites, rather than mobile pages. For those, consider the Mini Calendar instead. :)

Want to customize the look and feel of your full calendar widget? Just add your CSS code to your calendar's Custom JS/CSS.

Example of a full calendar widget

Mini calendar

The mini calendar is similar to the full calendar -- only smaller! This compact widget is great for pages with little available real estate, and they also display well on mobile devices, too. The widget will display a list of upcoming events by default. When a user clicks on a date in the calendar, however, a list of events on that day will display. Users can then click on the link to the event they want to learn about. This will take them to the event's page, where they can also register.

Example of a mini calendar widget

Event lists

If you're looking to display events in a simple list, then look no further than the various event list widgets. These widgets will display a list of upcoming events over a certain period of time, and can be customized to show the full details for each event or just a simple list. Either way, these widgets provide links to the full event page for each event, where patrons can register.

You can create the following event list widgets:

  • Upcoming Events: this will show the chosen number of upcoming events for one or more calendars.
  • Today's Events: this will show all events happening on the current date for one or more calendars.
  • Events this Week: this will show events in the next 7 days for one or more calendars.
  • Events in the Next 2 Weeks: this will show events in the next 14 days for one or more calendars.
  • Events in the Next Month: this will show events in the next 4 weeks for one or more calendars.

Example of an upcoming events widget


Creating calendar widgets

  1. Select the type of widget you want to create.
  2. Select one or more calendars you'd like to include in the widget.
  3. If you've enabled Multiple Sites in your calendar(s), you can filter events by site (campus, branch, etc.).
  4. You can also filter events in each calendar by category, as well.
  5. Depending upon the type of widget you're creating, there will be different customization options.
    • For full calendar widgets:
      • Calendar options: these allow you to customize the size and display of your calendar, including things such as date and time formats.
    • For mini calendar widgets:
      • ​Window target: you can choose whether event links open in a new window or the same window.
      • Calendar size: you can customize the dimensions of the mini calendar (in pixels).
      • Limit number of events: this allows you to limit the maximum number of events to display in the widget at one time.
    • For event list widgets:
      • Limit number of events: this allows you to limit the maximum number of events to display in the widget at one time.
      • Event details: you can choose to display the full details for each event (title, date, time, presenter, description, etc.), or a simple list (just the title, date, and time).
      • Window Target: you can choose whether event links open in a new window or the same window.
      • Widget Request Format: you can choose between a URL for use in an iframe, frame, or script, or javascript code which you can embed directly into a webpage or LibGuide.
  6. Copy the HTML code or URL from the bottom of the page to embed your widget.
    1. A live preview will display at the top of the page (except for full calendar widgets) so you can see how your widget will look in real time.

Example of creating a calendar widget 

Related Articles