I am creating a registration form for a tutoring service.
The idea is that the client enters their name, email address etc. and can then choose a time. The time that can be chosen is the same every weekday.
E.g. on Monday always at 2pm and 3pm.
On Tuesday always at 4pm and 5pm and so on.
The time should be a “clickable field”. The field the customer clicks on is the selected field.
How can I create this using a calendar? E.g. When the customer clicks on Monday in the calender, no matter which Monday in the year, the times that are available on Monday should always be displayed, so in this case 2pm and 3pm o’clock. But once the appointment has been booked, it should not be possible to book this exact date und time again.
Integrate a calendar and update it with users selection or embed calendly etc
Thanks, but how can I do it that the time is displayed every week? I don’t want to put it in manually for every single week.
A recurring calendar event in the integrated calendar or your DB
Yeah this is one of the things I’ll generally use an external service for unless I have a specific reason not to. I do it on my website.
If you want the meeting bookings to be added to your Bubble DB, most of these providers (Calendly/Cal) will send webhooks to your Bubble app where you can add them. I find this quicker and easier than manually creating a booking system in Bubble (and using external services also means I can use auto-availability based on my external calendars without manually configuring availability).
Some might be like ‘well you’re a Bubble dev, why not build it on Bubble?’. Because why would I rebuild something that’s been done dozens of times better than I could do it when I could spend time working on actually important stuff!
There are plenty of calendar tutorials if you do want to go Bubble native though - I’ve done it for two different apps, it’s just fiddly.
Wow, the calender on your website is perfect, exactly what I am looking for. Did you also use a tutorial and if yes can you maybe share the link:)?
I just embedded https://cal.com/ as an iFrame. I set the page background to be the same colour as Cal’s default background.
and set dimensions to 100% width and 100% height. Cal.com supports webhooks with Bubble.
Thank you very much, it worked well
Actually found it from one of your links/websites
This topic was automatically closed after 70 days. New replies are no longer allowed.