Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

This article explains how to add a Lightning calendar to a record page.

To add a VisualForce calendar to a record page, see: /wiki/spaces/BPD/pages/558891009.
For more information about Lightning versus VisualForce calendars, see: Calendar Differences.

Step-by-Step Guide

  1. Go to a record for which you want to add a calendar. In the top right of your screen, click the gear icon and then Edit Page.

    You can also get there through Setup > Object Manager > (your object) > Lightning Record Pages.

  2. From the ‘Custom - Managed’ section in the left panel, drag and drop a calendar component onto the page. This article covers the Single Calendar, the Multi Calendar and the Mobile Calendar components. For the Schedule components, see: Scheduler Horizontal, Vertical and Mobile Calendar components.

  3. In the right panel, select a calendar to display. This is the calendar record that will drive configuration for the component. For more information, see: Set up Calendars & Views.

  4. Feel free to add more components to the page. You can even add multiple calendar components to one page! Just make sure the calendars have enough space to display nicely. When you’re done composing, save and activate the page.

...

Vertical Calendar

The Single Vertical Calendar component will show a calendar just for one record. On the top horizontal axis it will show the days as column headers, and on the left vertical axis it will show the time slots as row headerswith times on the vertical (left) axis. Depending on the configuration, the horizontal (top) axis will either display dates or dimensions. In the latter case, the dates will instead be displayed on the vertical axis along with the times.

...

Note

When configuring the Single Vertical Calendar component, it’s possible that you won’t see any options in the Calendar dropdown. First make sure that a calendar record exists that is of the Single Vertical Calendar record type, and that the calendar’s dimension is the same object as the record page of which you are adding the component to.

...

Horizontal Calendar

The Multi Horizontal Calendar component will show a calendar for multiple records. On the top horizontal axis it will show all the time information as column headers, and on the left vertical with times and dates on the horizontal (top) axis. On the vertical (left) axis it will show all the records as row headers.

...

On the left vertical axis, the Multi Calendar component will show the children of the record that the component is displayed onIf the Horizontal Calendar component is placed on a record that is a parent of other records containing reservations, it can be configured to show those child records. Our example above is a building with a couple of rooms in it. When configuring the component, simply select which related list contains the children:

...

To make If the Multi Calendar component a little smarter, if it Horizontal Calendar detects that the lookup of the children to the parent is self-referential, as is the case with Resources and their Parent lookup, it will display the entire hierarchy from the parent on down. In our example building above, if we would go to its parent (which is a city with multiple buildings), we could see the following:

...