Services Plugins FAQs

Dynamically Assigning Colour to Events in Air Calendar

Hi,
Hope you are doing well. I’ve been working on the implementation of a Calendar/Event interface using the Air Calendar plugin and I wanted to know if it was possible for the Event’s datasource to be assigned a colour dynamically instead of a field value.
For example “This events → User IS Current User” then set blue. I’m assuming the calendar keeps a list of entries to display but I haven’t had much luck in trying to access an individual event directly.
If something like this is possible could potentially let me know and give me a few pointers in the right direction. Hope all of this makes sense.
Thanks for your time.

Hi @abdullah ,

Thank you for reaching out! :pray:

I just wanted to let you know that we’ve already replied to your query via email. Please check your inbox for the details.

If you have any further questions or need additional help, feel free to reach out here or by email. :star2:

Best regards,
Support Team
Browse all Zeroqode Plugins for Bubble
Banner_Last3

Hi @mina.rotari
Could you share the direction you provided to @abdullah - I have the same use case / requirement. I need to need to dynamically set the event background colour based on other event attributte values.
Thanks
Nial

Hi @nial.healy ,

Thank you for reaching out! :pray:

The Air Calendar plugin does support dynamic event colors, which can be a great way to visually distinguish events based on specific criteria. While the plugin doesn’t directly allow you to set conditional logic like “if the event’s user is the current user, set the color to blue” within its settings, you can achieve this by preparing your data source and leveraging the plugin’s dynamic color feature. Here’s how you can approach this:

  1. Add a Color Field to Your Event Data Type: In your Bubble database, ensure your event data type (e.g., “Event”) has a field to store the color, such as “EventColor” (type: text). This field will hold the HEX color code for each event (e.g., #0000FF for blue).
  2. Set Up Conditional Logic in a Workflow: Since the plugin itself doesn’t handle conditional logic for colors, you can use Bubble workflows to dynamically assign the color to the “EventColor” field based on your condition. For example:
  • Create a backend workflow or a workflow triggered when an event is created/updated.
  • Add a step to “Make changes to a thing” (the event).
  • Set the “EventColor” field dynamically: if “This Event’s User = Current User,” set it to #0000FF (blue); otherwise, set a default color like #000000 (black). You can use Bubble’s conditional expressions to define this logic.
  1. Configure the Air Calendar Plugin: In the Air Calendar element’s properties, enable the “Use dynamic colors” option. Then, map the “Event color” field to your “EventColor” field from the event data type. The plugin will use this field to apply the color to each event on the calendar. The color value must be in HEX format for the plugin to recognize it properly.
  2. Test and Adjust: Once set up, preview your app to ensure the colors are applied as expected. If the colors aren’t displaying correctly, double-check that the “EventColor” field contains valid HEX codes and that your data source is correctly linked to the calendar.

This approach allows you to dynamically color events based on conditions like the event’s user, but it requires pre-processing the color assignment in your database. Unfortunately, the plugin doesn’t provide a way to directly access or manipulate individual events in the calendar for real-time conditional formatting without this data preparation.

For more details on setting up the plugin, you can refer to the documentation here.

Looking forward to your reply. :sparkles:

Best regards,
Support Team

Browse all Zeroqode Plugins for bubble

Banner_Last3

Thanks Mina - that worked perfectly.

Hi @nial.healy,

I’m thrilled to hear everything is running smoothly now! :raised_hands: It’s always a pleasure to help, and we truly appreciate having you as part of our community.

If you’ve been enjoying our plugins, we’d love to hear your thoughts! Your feedback not only makes our day but also helps others in the Bubble community discover the best tools for their projects.

Leaving a quick 5-star review takes just a minute and makes a world of difference. Simply head to the Plugins tab in the Bubble editor, search for the plugin, and rate it! :star2:

Want to help even more? Share your experience on:
:link: Zeroqode Reviews
:link: G2
:link: Clutch
:link: Trustpilot

Your support means everything to us and helps us continue building awesome products for you! :rocket:

Thanks a ton, and have an amazing week ahead! :pray:

Best regards,
Support Team
Browse all Zeroqode Plugins for bubble
Banner_Last3