[Template] Top Shelf Calendar - Scheduling & Bookings like Calendly

After much teasing and Beta testing I am super excited to finally be releasing the Top Shelf Calendar Template to all Bubblers :tada: :spiral_calendar:

Test the Template in run mode here: https://top-calendar.bubbleapps.io

Bubble Template page to get it now: Top Shelf Calendar Template | Bubble

The Template allows you to build your own custom Calendar or Scheduling application similar to Calendly / Acuity / BookMe, etc (minute or hourly schedules, not day-to-day scheduling like airbnb).

It is fully responsive, works across all time zones and has most of the major features you need for scheduling, and if not the best part is you can finally customize your own scheduling app to do exactly what you want! Stop trying to replicate the annoying scheduling functionality in Bubble and just use this so you can focus on the differentiating features that ultimately matter to your Users and get them to choose your app over another.

LIMITED TIME PRICING
For this week only you can get this template for just $219
After that the price will be $300+ as there will be more in depth documentation to go along with it

NOTE - The template uses the TopCal Plugin, so you will need the plugin for the logic to work, but thanks to the Plugin it gives you simple access to performance and feature upgrades that come in the future, when compared to just a template that requires you to try and copy and paste any new updates.

PS - as with any Launch there can be a bug or two - so if you find any let me know asap so we can get it resolved quickly :ok_hand:

9 Likes

Congrats! @gf_wolfer :tada:

Super excited to see this template launched.

I purchased it now & will begin with development. Geoff has been super responsive & has been reliable for support during the Beta testing. :100:

1 Like

Thank you for the awesome feedback through all this, it’s helped shape some of the features that made it into the template :raised_hands:

For everyone else, please stay tuned for documentation later this week, and if you do purchase it and have any questions I will be extra responsive during this discounted week to help everyone get over the ‘limited-documentation’ hurdle :call_me_hand:

1 Like

@gf_wolfer : Awesome tool! Just checked it out and was wondering how many new events I can create in my standard plan?

I am building a two-sided marketplace where clients want to schedule calls with experts. Thinking about how I can use Top Self Calendar, I guess each of my clients would need to have his own link, but does this require me to have several standard license accounts? Any advice would be appreciated!

Thanks in advance!

@gf_wolfer Could you let me know how the database in bubble is connected to the top shelf calendar? Can every entry be saved in the database?

Also, I am wondering whether it is possible to customize fields? I know that it is possible with regards to the designs (e.g. colours, fonts, etc.) but I would love to edit the fields that are already in the template (see screenshot). For example, in our case I would like to delete the event name and some other fields. Would this be possible?

Thanks a lot for in advance!

Hey @armin happy to give some more insight here.

Do you have much experience with Bubble already? I ask because it is simple within the Bubble Editor to Add/Remove or Change fields if you have some experience. You will need to make changes to the Data Type fields and then add and adjust the inputs on the screenshot you have shown above. If you are still a beginner, I would recommend learning some more about creating and editing an app in Bubble before purchasing (or with the expectation you will need to learn some more Bubble to properly make changes to the template)

Regarding the Plan level, when you create an App with the template it will need to be on at least a Personal Plan (or lowest level paid plan - can’t remember the name), so that you can also subscribe to or purchase the TopCal Plugin. But beyond that there are no advanced needs from this template that require an expensive plan.

On that plan you can have many Users who have their own Accounts and Schedule links - You can test creating multiple accounts in the template to see what that is like.

The Template might be a good option for you, or if you want to look more into building things from the ground up but making sure the Scheduling piece is done correctly, you might want just the Plugin. For more information on the Plugin and how to create Scheduling in Bubble you can checkout this page: topshelf-elements.bubbleapps.io/topcal-example

For those who have purchased the Template, you can DM me with your Email if you want to know of any Major updates that you might want to implement in your own app.

Or simply check this page occasionally to see what fixes or changes are done to the template so that you can implement them into your own app:
https://topshelftemplates.gitbook.io/top-shelf-templates/

Important Bug Fix on the /calendar page:
12am Time Slots were not being shown because of this filter which should be changed to this:

More details on how to fix it your app here: https://topshelftemplates.gitbook.io/top-shelf-templates/

Future versions of the template will have this already included

Price of $219 for the rest of this weekend only, so get it now if you are interested!

$299 starting on Monday

Bug fix - basically the same issue as the last fix but for 12pm time slots not showing up. A summary of how to fix it in your Template can be found here and all future versions of the template will have the fix automatically included

Hi @gf_wolfer ,

Thanks for getting back! I gained some experiences in Bubble with editing data as you mentioned and would love to try Top Shelf Calendar.

I am just not 100% sure whether it fits the workflow I am trying to build + would love to give you some more context to get a clearer understanding for what is possible with this plugin.

We have a marketplace for mentors and mentees whereby mentees can schedule calls with mentors based on their availability.

During the signup, mentors are asked to put in their time availabilities. Here I have 2 questions:

  1. Is it possible to use TopShelf calendar as part of a sign-up form in Bubble? In that case - instead of clicking on “Create an event”, (as indicated in the Demo), mentors should directly be redirected to the “details”/“settings” & “availabilities” section and skip the “create an event” part. We still want to get the calendar link (where mentees can book slots) + show it on his profile. Is that possible when skipping “Create an event”?

  2. When a mentor fills out his availabilities - does he need to leave the bubble app & create a topshelf account or can this be done within the app (in our case: the signup form)?

  3. Another question refers to updating the calendar availabilities in Bubble. We want the mentor to review his signup information in his profile. There, he can also see his given time availabilities and has the option to edit them. Is this possible within the app or similar to the question above, does the mentor need to leave the app to edit his event (as shown in the demo, see screenshot) "

    ?

Thanks in advance for your help! Much appreciated!

Looking forward to hearing back from you.

Best,
Armin

You can use the template and customize it or you can build from the ground up and use just the plugin. Both will require a bit of work to get going, but this template might save you a lot of work coming up with a design. So to the questions:

  1. You would use the Workflows to ‘Create an Event’ and move it to when a User signs up. As that workflow essentially builds a ‘schedule’, and then that schedule is created you would want to assign it directly to the newly created User so that it is their single schedule.

  2. When you have the Template, the app is fully yours and no longer ‘Top Shelf’, so they would stay within your app. If you need to combine this template with an app you already created, you will need to copy and paste pages from one to another so that it is all in one app.

  3. Again, this is all in your own application and instead of having a List of Events, you could change it to just a link that says ‘Edit Schedule’ or something, and then the Editing Availability page can be the same. Or you can copy the Edit Availability page and workflows to a more relevant page within your own application.

Have you tried using a Free template before? It is a great way to se what it is like to acquire a template and you can test copying and pasting elements and workflows to see how simple (or difficult) it may be to combine two apps. This is a great template to add for free to test things out: https://bubble.io/template/top-shelf-elements-1540418806056x885804163222208500

*Just re-read your post, is you current Mentor - Mentee app built in Bubble? All my answers above assumed yes. If it is not a Bubble app then things get more complicated

Hi @gf_wolfer ,

Thanks for getting back!

Yes, my app is built in Bubble. :slight_smile: I wanted to check out the free plugin that you mentioned. However, it seems that it is no longer available (see screenshot) or do I overlook sth?

Thanks for clarifying!

Best,
Armin

Responded in DM to keep this out of this thread

Hi @gf_wolfer,

I just bought the “Top Shelf Calendar” but somehow the “availability” function is not working in the template.

Page “event-editor”: When I want to set up my availabilities, the times that I select in the popup are not displayed on the dashboard (so when I click on “save”, nothing appears). See screenshots

Page Calendar: Since I couldn’t set up any availabilities, I guess this is the reason why I don’t see any calendar options

(see screenshot)

Do you know what the issue is?

I am also wondering whether it is possible to set up a unique identifier for the relationship “booked call mentor + mentee” when mentees book a call with the calendar link outside the app? To give some context: Each mentor has his own calendar link which we gonna share with a few mentors via e-mail. When the mentee clicks on the link (outside the app) + selects a few time slots - are these times slots then shown in the Bubble Database? And does it automatically set up an UID for this relationship?

Thanks in advance and have a lovely day!
Armin

Thanks for purchasing! It looks like you need to purchase and install the TopCal plugin, you can do this from the Plugins tab in the template.

I’m confused with what you mean by ‘outside the app’.

In the template, you can see how a Calendar/schedule is created and a link is generated. This is the link that would be shared so that someone can be booked.

On the /calendar page, the Confirm Booking workflow has the logic for saving the booking which relates the Booker/Mentee, to the Calendar/Schedule/Mentor

Time slots are not saved in the database but generated on page with the plugin based on a Mentor’s availability and bookings. The Time arrange that gets booked is saved in the Database though and can be looked up (you could also save the time slots the appointment occupies but not necessary)

Hi @gf_wolfer,

Thanks for getting back! I only installed the plugin in my original app, but now copied all the workflows from the template + together with TopCal it is working in my app.

To clarify my question, I recorded a short loom: Loom | Free Screen & Video Recording Software

Thanks a lot for helping out!

Have a great day,
Armin

Updates to the template are coming soon!
Since I created this template I have had a lot of amazing feedback and worked directly with some users. From this I have found new use cases and also some common areas where people get confused that I would like to ‘clean up’.

To help current and future customers I will change the way that some of the data is structured to be more in line up with how it is done on the TopCal example page. Both are completely good strategies to use, but by having two different strategies it made it confusing for some users.

If you have purchased the template and have any direct feedback of anything that could be improved for the template let me know as I like to group as much of the updates together as I can.

Cheers :call_me_hand:

2 Likes

I think there’s an issue in the getavailabletimeslots element. Even when I add the start and end availability, it offers availabilities before and after this time.
Screen Shot 2021-05-06 at 6.46.07 PM

Screenshot attached showing both the setup of the element and the debugger view which shows that it is ignoring the input “Between” dates.

Good job noticing this, I wanted to write more about this earlier to clarify but don’t think I ever did.

Essentially, this is intentional and can be helpful when users and the ‘available times’ are across distant time zones.

It should only be off about 2 days max from the dates to give leeway for multiple time zone use cases since that the maximum 2 time zones can be different is 26 hours. And this I think is just for the Pattern availability, if you feed in Specific Available Date Times outside that range I think they still show (add filters to your searches for this availability if needed)

I did have a hard cut off very briefly based on the exact time, but then this was causing some unexpected behaviour for users at the exact beginning and end time being in one time zone but not the Availability time zone and risked missing out on an available time. So I left it this was to give you the option on page to Filter specifically or show/hide using your UI elements depending on your use case. I thought better to give you a little more and then you fine tune then to not give the option at all

1 Like