How to use

Below are instructions for installing and using the plugin.

How to install

  1. Install the plugin from the plugin store

  2. Add the element, AirCalendar, to your page and resize it to your needs.

  3. At this point if you preview your page you will see an empty calendar without any events and buttons.

Creating events table in the database

  1. Go to the data tab in bubble.

  2. Create a new Thing . You can give it any name you like, e.g. Appointment.

  3. At minimum AirCalendar requires and Event start and end date field which is of type date. You can have other optional fields and any other fields you require for your application. Ideally you should have the three fields in bold.

    1. Event start date - date (required)

    2. Event end date - date (required)

    3. All day - yes/no (optional)

    4. Event title - text (optional)

    5. Event background color - text (optional)

    6. Event border color - text (optional)

    7. Event text color - text (optional)

    8. Blocked - yes/no (optional)

How to add events to calendar

To improve the speed of loading events into the calendar, Air Calendar, fetches events on demand. This means instead of loading all the calendar events when the page loads , Air Calendar allows you to load just the events needed for a view.

To achieve this the Air Calendar exposes the current view and the current view start date and current view end dates. So you can pas these as constraints to the event's Do Search query.

For better performance (faster event load), use the calendar's view start date and view end date states to restrict events to only those needed for the current view.

Last updated