Using Private Schedules

In this Article:

In ECAL, Private Events are Events that only appear in the individual Subscriber’s calendar.

1: Add ECAL Widget

Start by adding the following code to the of your webpage, replacing the apiKey value as required. You can also find your API Key by logging into your ECAL Admin (https://admin.ecal.net/login).

<script src='//sync.ecal.com/v2/ecal.widget.js' data-ecal-apikey='INSERT_YOUR_API_KEY'></script>

2: Add the button HTML to your webpage

Finally, add the ecal-sync-widget-button class and the data-ecal-widget-id attribute to the HTML element, you would like to open the ECAL widget in a popup window when clicked.

Usage of data-ecal-email : After a User’s successful subscription, the email address supplied will be sent using a webhook notification by ECAL. You can then use it to add the User’s ecalId to your existing customer record.

Example HTML Code

<!DOCTYPE html>
<html>
  <head>
    <script src='//sync.ecal.com/v2/ecal.widget.js' data-ecal-apikey='INSERT_YOUR_API_KEY'></script>

  </head>
  <body>
    <button
      class='ecal-sync-widget-button'
      data-ecal-widget-id='INSERT_YOUR_WIDGET_ID'
      data-ecal-skip-schedule-selection
      data-ecal-email='INSERT_YOUR_EMAIL' // this is optional
      data-ecal-no-styling
      >
      Sync to Calendar
      </button>
  </body>
</html>