How to set up calendars in Bubble

To set up a calendar in Bubble, the most reliable way is to install a calendar plugin (such as Full Calendar by Bubble) and connect it to a data type that stores events with fields like date, time, and title. After adding the plugin’s visual element to your page, you bind its “Data source” to a search of your Events. Then you configure actions so users can create, modify, or click events, depending on your app’s needs.

Understanding What Bubble Needs for a Calendar

A calendar in Bubble cannot work without a data type to store events. You need fields that represent the start and end of an event. The calendar plugin simply displays that data — it doesn’t create it for you.

• Create a data type called Event.
• Add fields like title (text), start (date), end (date).

Installing and Placing the Calendar

Go to the Plugins tab → “Add plugins” → search for “Full Calendar” (the Bubble-built one). Install it. Then in the Design tab, drag the Full Calendar element onto the page.

• In the element inspector, set its Data source to Search for Events.
• Set Start date field to Event’s start and End date field to Event’s end.
• Set Event caption to Event’s title.

Creating Events

You use a popup and a workflow to add events. For example, when clicking a button “Create event” inside a popup, run a Create a new thing workflow.

// Example fields for creating an Event
title = Input Title's value
start = Date/Time Picker Start's value
end   = Date/Time Picker End's value

Editing or Clicking Events

The Full Calendar element exposes events such as When this calendar’s event is clicked. You can open a popup, set its data source to Current event, and modify it with Make changes to thing.

• Event click → Show popup → Popup’s thing = Current event.
• Save button → Make changes to popup’s Event.

Privacy Rules

If events are user-specific, create a field creator = User and set privacy so users see only their own events. Go to Data → Privacy and allow Current User to view events where This Event's creator is Current User.

Result

With a proper Event data type, the Full Calendar plugin placed on the page, and workflows for creating/editing events, you get a functional, real-world calendar inside Bubble.