Skip To Content
Back to Help Center

Embedding or Adding CalendarAnything LWCCategorized in LWCCategorized in Feature Setup

Embed a calendar on the Salesforce homepage, on specific records, or elsewhere to view calendars more easily. Relevant calendars on records drive insights by allowing visualization of data in user-friendly ways. This can also increase user adoption for CalendarAnything, making it more useful to your organization.

In this article you will learn about:

Related articles:

Embedding CalendarAnything LWC

To add CalendarAnything LWC to the Salesforce homepage, record page layout, or in communities, follow these steps:

  1. Navigate to the page in which you want to embed the CalendarAnything component.
  2. Click the Salesforce gear icon and then select Edit Page to bring up Lightning App Builder. Note: If you do not see the Edit Page option, contact your system administrator.
  3. In the Lightning App Builder, in the left sidebar, find the CalendarAnything LWC component and drag it onto the section of the page in which you want the component to appear.

  4. Click the Save button.

Setting CalendarAnything LWC Properties

In Lightning App Builder, you have the option to customize CalendarAnything LWC using properties. The property labels and descriptions are described below.

Default View Mode
Agenda is the default view. The system administrator can change the default to another option, such as Day, DayGrouping, or Week.

Calendars Available to Enable
Enter the calendar ID or calendar Name from the Name and Color page within calendar setup.  Separate multiple calendars by commas. Leave blank to show user’s selected calendars and groups from General Settings > Display and Layout. This property supports using an expression to define its custom label. The correct format is {!$Label.customLabelName}.

Calendars to Enable at Startup
Enter the Name or ID of one or more calendars to be loaded by default when the page is loaded. Separate multiple calendars using commas. Any defaults entered here will override any user selection of calendars for this page. If no calendars are entered here, no calendars will be displayed the first time the user opens the page. Enabled calendars show records. To enable calendars, tap on the navigation icon and select calendars from the list.

Calendar Available for New Records
The system administrator can specify, and thus limit, the calendars that can be used to create new records. To do this, enter the Name or ID of the calendars that can be used to add records.  To do this, enter the Name or ID from the Name and Color page within calendar setup for each calendar that you want to specify.

Height
Set component height. For mobile, the recommended height is 500. The value is interpreted as pixels.

Expand Mobile Version
When this check box is checked, the application uses all available space on a mobile device setting.

Record Dynamic Filter Field
Used to filter records when a component is placed on the record page. Examples include:
* Add component on Account page
* Set Record Dynamic Filter Field = Id
* Add Dynamic filter on Calendar Edit Filter Criteria: Related To = DYN

Note: Dynamic Filter must be first filter within the Filter Criteria page within calendar setup.    Only calendar events related to the current account will be displayed within the component.

Display Mode Selector
If checked, the application will display View Mode selector.

Display Create New Record Icon
If checked, the application will display + icon (Create New).

Display Calendar Selector
If checked, the application will display a Calendar Selector.

Display Refresh Icon
If checked, the application will display a refresh icon that, when clicked, will display the latest records for all enabled calendars.

Display Today Icon 
If checked, the application will display Today icon.

Use CalendarAnything Create Forms
If checked, the application will use a custom record create form based on the Create and Edit Popup within calendar setup. Otherwise, it will use the standard new record layout for the selected record type.

Use CalendarAnything Event Detail Popup
If checked, the application will use a custom record detail popup based  on the Details Popup within calendar setup. Otherwise, it will use the standard record layout for a selected event.

Enabled Calendars Only on Create
If checked, the application will display only the currently selected set of calendars when creating new records. Otherwise, it will display all Calendars Available to Enable.

Additional User Settings
The system administrator can specify default user settings in JSON format. For example: {“swimlaneEnableListViews”:false}

URL Parameters
This property supports using an expression to define its custom label. The correct format is {!$Label.customLabelName}.

Max Reference Options
The system administrator can define the number of related lookup objects to load on start. For optimal performance, we recommended to set Max Reference Options to 10 or less.

Static Caching Time (minutes)
Cache time limit for objects metadata and user’s permissions. Default is set to 60 min. When set to 0, caching is turned off.

Session Caching Time (minutes)
Cache time limit for Calendars information. Default is set to 60 min. When set to 0, caching is turned off.

CA Read-only Settings
Set “true” for enabling ReadOnly mode, or JSON with separate options This property supports using an expression to define its custom label. The correct format is {!$Label.customLabelName}.

Publishing CalendarAnything LWC on Force.com

Available in: Developer, Enterprise, and Unlimited editions ONLY.

The CalendarAnything LWC can be displayed on a Force.com site. Doing this takes three simple steps:

  1. Creating a Lightning application
  2. Creating a Visual Force page
  3. Creating a Force.com site page

Creating a Lightning Application

Follow these steps to create a Lightning application:

  1. Navigate to Salesforce and click the gear icon in the top right corner. Then choose Developer Console from the dropdown.
  2. In Developer Console, Click File > New > Lightning Application.
  3. On the New Lightning Bundle popup, enter a Name for the application and make sure to check the Lighting Out Dependency App checkbox.

    A page similar to the one below appears.
  4. Remove all of the highlighted code from the text area.
  5. Into the blank area, copy and past the following code:
    <aura:application access="GLOBAL" extends="ltng:outApp" implements="ltng:allowGuestAccess" />
  6. Click File > Save to save the application.

Creating a VisualForce Page

To create a VisualForce Page, follow these steps:

  1. Navigate to Setup > VisualForce Pages > New.
  2. Fill in the fields in the Page Information section.
  3. Make sure to check the checkbox labeled Available for
    Lightning Experience, Lightning Communities and the mobile app
    .
  4. On the next page is a code sample for the site. In this example, we include Calendar IDs, but replace them with the IDs of the calendars you need to display and enable on your site when you copy and paste. Copy from <apex:page> to </apex:page>.

<apex:page >
  <apex:slds />
  <apex:includeLightning />
  <div id="calLightning" class="wrapper"></div>
  <script>
    var calendarApi = null;
    // Create custom app and expose it to VisualForce
    $Lightning.use("c:calendarLWC", function () {
      // add some settings
      let userAdditionalSettings = {
        displayTimeZone: true,
        dayModeArea: "0_1",
        readonly: {
          move: false
        },
      };
      $Lightning.createComponent(
        "slcalwc:calLoader",
      {
      //These are just example IDs and should be replaced with your CalendarIDs
      calendar: "a024T00000257LDQAY, a024T00000257LFQAY",
      //These are just example IDs and should be replaced with your CalendarIDs
      enabled: "a024T00000257LDQAY, a024T00000257LFQAY",
      // The default start view mode
      view: "Month",
      showModeSelector: true,
      userAdditionalSettings: JSON.stringify(userAdditionalSettings),
      height: "800px",
      //uncomment to hide sidebar or pass additional url params
      // urlparams: "sb=2", 
        func: {
          ready: function (oApi) {
            calendarApi = oApi;
          },
        },
      },
      // id of div you want to put new Lightning element
      "calLightning",
      (cmp) => {
      // callback for create element 
      //(NB calendar load event is not equal to this)
      // to execute something after calendar is loaded use ready
      console.info("created");
      }
    );
  });   
</script>
</apex:page>

Creating a Force.com site page

To make your CalendarAnything LWC public, you must create a force.com site page. This can be an existing page or a new one. To set up your Force.com site, refer to SALESFORCE’S SETTING UP SALESFORCE SITES.

Once the site is ready for setup, perform the following steps:

  1. Replace the Active Site Home page with the new VisualForce page.
  2. Click Save and your site is ready to be published.

Note: If your site is brand new, then you will need to configure Sharing Rules as well (see next section).

Creating Sharing Rules for your Force.com site Guest Site User

If your Force.com site is brand new, you must configure Sharing Rules. To do so, follow these steps:

  1. Navigate to Setup > Sharing Settings.
  2. Click Edit.
  3. Scroll to the Other Settings section and make sure the Secure Guest User Record Access checkbox is checked.
  4. If the Secure Guest User Record Access checkbox is not checked, contact your system administrator.

Creating a Sharing Rule for a CA_Calendar Object

Fill in the Sharing Rule label. The criteria defines what will be shared with your site user and depends on your use case. In this example, the rule being created gives the Guest Site user access to all calendars. Please make sure you are sharing with the right Guest Site user.

Important! Once shared, the Guest Site user can access the calendars but not the records displayed on the calendar. You must replicate the process for each object that feeds into the calendar.

Creating and assigning a custom CA LWC Permission Set for a Guest User

Salesforce is removing the View All, Modify All, Edit, and Delete object permissions on all objects for guest users in new and existing orgs. These permissions are removed for custom objects and standard objects. Guest users can only have Read and Create object permissions. See SF SPRING 2021 RELEASE NOTES for more.

How does this change affect calendars published on Force.com sites?

Guest Site Users will receive an error message and will not be able to view the calendars. If the View All, Modify All, Edit, and Delete object permissions are part of a permission set or permission group and assigned to a guest user, then the guest user is removed from the permissions set or permission set group. Guest users also lose access to other permissions that are included in those permission sets and permission set groups.

CalendarAnything LWC Default Permission Set includes Edit and Delete permissions for CalendarAnything LWC custom objects.

This is what your organization’s Salesforce admin will need to do before the Spring’21 Release is applied to your organization to avoid service interruption for Force.com calendars.

Clone CalendarAnything LWC Default Permission Set
Open newly created permission set
Go to Object Settings
Update object permissions for CalendarAnything LWC custom objects to Read access

After the new permission set is ready, update Permission Set Assignment for all Site Guest Users

In Setup, go to Sites > click on Site Label > Public Access Settings > View Users> click on user’s Full Name> Edit Assignments(Permission Set Assignments).

We don't support Internet Explorer

Please use Chrome, Safari, Firefox, or Edge to view this site.