Public Calendars | Modifying for your Website

eSPACE makes it easy for users to display the Public Calendar on their own website by providing an iFrame snippet of code (embed code). However, in some cases, users may need to modify the snippet to fit in with the rest of the page being embedded.

This article will explain how users can modify the iFrame snippet (embed code) to better suit their website's design.

Some clients are seeing a visual display on their website that does not expand the dates within the monthly view of the public calendar.  You may see something like the image below where the days within the month are not displayed.  If this is the case, follow these instructions to update your embed code as appropriate for your organization's website design. 

Go to the left navigation bar>Settings>Advanced>Public Calendars

Once on the Public Calendars page, you can copy any one of your Public Calendar's embed code for use on your organization's website:

Using the following code as an example, we will provide suggestions on attributes they may wish to change:

Here are a few attributes users may wish to change in the iFrame snippet:

1. id: The "id" attribute is used to identify the iframe element in the HTML document. Customers may wish to change the value of this attribute to match their own naming conventions.
2. style: The "style" attribute defines the appearance of the iframe element, such as its width and the appearance of its border and overflow. Customers may wish to change the style to match the look and feel of their website.
3. scroll: The "scroll" attribute defines whether the iframe should allow scrolling. Customers may wish to set this attribute to "yes" if they want the calendar to be scrollable.

In conclusion, while eSPACE provides customers an iFrame snippet of code to embed the Public Calendar on their organization's website, users may need to modify the snippet to better fit in with the rest of their website. By changing the attributes and script, customers can make the calendar look and behave the way they want it to.

NOTE:  You may need an IT Professional or Web Developer to assist you in doing this