Link to the plugin page: https://zeroqode.com/plugin/calendar-tool-plugin-for-bubble-1695234333263x662814044958238500
Demo to preview the plugin:
Introduction
Simplify the process of generating a calendar from a repeating group. It’s especially useful when you’re looking to implement a booking feature or craft a personalized date selector.
👛 Please support our efforts to keep this plugin free—your donations help us invest the time and resources needed to continue maintaining and improving it for everyone’s benefit: https://zeroqo.de/support.
How to setup
- Add the Calendar Tool element to the page
- Go to the Design tab in your Bubble editor.
- Search for the element called Calendar Tool in the elements panel.
- Drag and drop the Calendar Tool element onto your page wherever you want the calendar to appear.
- Configure the Calendar Tool element properties
- Month Date
- Time Date
- Time Interval
- Starting day
After placing the Calendar Tool element on the page, select it and configure the following properties visible under the Appearance tab:
Sets the reference month to display in the calendar. This is usually a dynamic date, e.g.
Current date/time. Changing this date updates the month shown.Defines the reference time for the calendar if you’re working with time slots or scheduling. Leave blank if your calendar is purely date-based.
Indicates the duration, in minutes, for each time slot if displaying time intervals (e.g.
45 for 45-minute slots). Used if your calendar represents time-based entries.Defines which day of the week should appear first in the calendar. Options include Sunday, Monday, etc.
Plugin Element Properties
Calendar Tool
Fields:
Title | Description | Type |
Month Date | Sets which month the calendar displays. Changing this date updates the visible month. Usually, you’d set it dynamically (e.g. “Current date/time”). | Date |
Time Date | Defines the reference date and time if you’re working with time slots in your calendar. Leave it blank if your calendar only handles dates. | Text |
Time Interval | Controls the size of time slots in minutes (e.g. 15, 30, 45). Useful if your calendar shows scheduled times instead of just dates. | Number |
Starting day | Lets you choose which day of the week the calendar starts with, like Sunday or Monday. | Text |
Exposed states
Title | Description | Type |
List of Dates | A list of all dates currently shown in the calendar. Handy if you want to generate repeating group cells for each day or load related events. | Date |
List of Times | A list of time slots for each day, based on your chosen time interval. This only has values if your calendar displays times. | Date |
Start of month | The first date of the month currently visible in the calendar. Perfect for filtering or loading data for a specific month. | Date |
End of Month | The last date of the month currently visible in the calendar. Useful for defining date ranges in searches or reports. | Date |
Start day | The day of the week the calendar view starts on (e.g., Sunday or Monday). Helpful for aligning the UI with locale preferences or user settings. | Date |
