Google Calendar Booking Calendar
Embedding a Google Calendar booking calendar (with timeslots) into your RevasOS site is easy and allows you to manage appointments and bookings directly from your site. Follow the steps below.
Get the code
- Log in to your Google account: Go to Google Calendar and log in with your credentials.
- Create a booking calendar:
- Go to the Bookings tab or select the main calendar.
- Click on Create and choose Availability times.
- Configure your availability times:
- Define the days and times you are available.
- Customize the length of the booking slots (for example, 30 minutes).
- Add any notes or details useful for bookers.
- Save the booking calendar.
- Get the link or booking code:
- Go to the calendar settings.
- Find the Share bookings option.
- Copy the link for the booking page or the embed code (starts with
<iframe>
).
Insert the code into RevasOS
Once you have the code, go to RevasOS and:
- Go to the page where you want to insert the booking calendar.
- Click on New block and select New code block.
- Paste the code into the block.
- Save the page to make the booking calendar visible on your site.
Change the size and appearance of the inserted calendar
If you want to change the size of the calendar (for example, make it full page or center it with padding), you can do so by editing the HTML code of the iframe. Here's how:
- Copy the iframe code of the calendar you already inserted.
- Paste it into a ChatGPT prompt with a request like this:
- To make it a full page:
Edit this HTML code to make the booking calendar a full page. I only want HTML with inline CSS, no JavaScript, here is the code: [replace this space with your embed code]
- To center it on the page:
Edit this HTML code to make the booking calendar centered, with padding around it. I only want HTML with inline CSS, no JavaScript, here is the code: [replace this space with your embed code]
- Copy the result of the code.
- On RevasOS:
- Go to the page where you want to insert the modified calendar.
- Click New Block and select New Code Block.
- Paste the code into the block and save.
With this guide you can easily integrate Google Calendar booking calendars into your RevasOS site, improving your appointment management and user experience. ⏰✨