Skip To Content
Back to Help Center

Embedding or Adding CalendarAnything LWCCategorized in Feature Setup

CalendarAnything Classic KA | Embed

CalendarAnything Classic KA | Publishing CA on Force.com Site

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 how to:

Related articles:

Embed CalendarAnything LWC

To add calendar to the Salesforce homepage or on the record page layout, navigate to Lightning App Builder:

Click on the Gear > Edit Page.

In the Lightning App Builder, in the left sidebar, find the CalendarAnything LWC component and drag it onto the page.

Click the Save button.

CalendarAnything LWC Properties

In Lightning App Builder, you have the option to customize CalendarAnything LWC. Below you can see a list of properties that can be configured for CalendarAnything LWC in Lightning App Builder.

Default View Mode

Agenda is the default view. Admin can change the default view to one of other options we offer, such as Day, Day with grouping or Week.
Calendars Available to Enable
Enter Calendar ID or SiteCalendar Name from Name and Color page within calendar setup.  Multiple calendars can be separated by commas. Leave blank to show user’s Selected calendars and groups from Display Settings. This property supports using an expression to define its custom label. The correct format is {!$Label.customLabelName}.

Calendars to Enable at Startup
Enabled calendars show records. Enter Calendar ID or SiteCalendar Name Name and Color page within calendar setup. Multiple calendars can be separated by commas. Admin can list Calendar friendly names (comma separated) or Calendar Ids that will be loaded by default every time the user opens the page. It will override any selection made by the user from the list of available calendars. If left blank, no calendars will be loaded when the user opens the application for the first time. To enable calendars, tap on the navigation icon and select calendars from the list.

Calendar Available for New Records

Admin can limit the list of calendars available to users to create new records. Enter calendar ID or Name from Name and Color of calendar setup.

Height
Set component height in px. For mobile recommended height value is set to 500.

Auto Hide DatePicker
When checked, will auto hide date picker calendar after user selected some date.

Record Dynamic Filter Field

Used to filter records when a component is placed on the record page. For example:ο Add component on Account page

ο Set Record Dynamic Filter Field = Id

ο Add Dynamic filter on Calendar Edit > Filter Criteria: Related To = DYN

Then only calendar events related to the current Account will be displayed with the component.

Note: Dynamic Filter must be first filter within Filter Criteria 

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

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

Display Calendar Selector
If checked, will display Calendar Selector.

Display Refresh Icon
If checked, a refresh icon will be displayed. Clicking the refresh button will display the latest records for all enabled calendars
Display Today Icon 
If checked, will display Today icon.
Use CalendarAnything Create Forms
If checked, will use a custom record create form based on Create and Edit Popup within calendar setup. Otherwise, will use standard new record layout for selected record type.

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

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

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

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

Max Reference Options
Admin 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 300 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

Create a Lightning App
The CalendarAnything LWC can be displayed on a force.com site.

Note: A system administrator will need to help with setup.

To create a lighting app, navigate to Salesforce and click on the gear icon in the top right corner. Then choose
Developer Console from the dropdown.

In Developer Console, Click File > New > Lightning Application.

Name the application (Ex:calendarLWC) and make sure to check the ‘Lighting Out Dependency App’ checkbox.

That creates something that looks like:

Remove everything and copy/paste the following:


<aura:application access="GLOBAL" extends="ltng:outApp" implements="ltng:allowGuestAccess" />

It should look like this:

Save by going to File > Save.

Create a VisualForce Page That Our Site Will Load

To create a VisualForce Page, navigate to Setup > VisualForce Pages > click New.
Fill in the fields in the Page Information section. Make sure to check the Available for Lightning Experience, Lightning Communities, and the mobile app checkbox.

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:cal",
      {
      //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>

 

Create 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 on the site set up, replace the Active Site Home page with the VisualForce page we just created.

Save and your site is ready to be published.

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

Create Sharing Rules for Guest Site User on Your Force.com Site

First, go to the gear icon on the top left of your page and then click on Setup. Once there, click on Sharing Settings.

In Organization Wide Defaults, click on the Editbutton.

Then, turn the Secure Guest User Record Accesson.

Scroll all the way to the bottom to find this option.

In order to support the visibility of the calendar and the data exposed by CalendarAnything LWC, your system admin must create sharing rules for all objects exposed on a Force.com site.

For example, to publish a force.com site with an event calendar see the next section, Create a Sharing Rule For CA_Calendar Object.

Create a Sharing Rule For 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, we will create a rule that gives the Guest Site user access to all calendars. Please make sure you are sharing with the right Guest Site user.

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

Create and Assign Custom Calendar Anything 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.