Add booking system to website

In this article

1. Introduction
2. Get Started with Koalendar
3. Embed the Code to Your Webpage
4. Popup Text
5. Inline Embed
6. Popup Widget

Introduction

Koalendar is an online booking and appointment scheduling tool that allows customers to book services directly through your website. By embedding Koalendar into your EasyStore store, you can now offer a simple booking experience while managing appointments, availability, and schedules in Koalendar.

Get Started with Koalendar

2.1 Go to Koalendar > Click on the “Get Started” button > Signup an account.

2.2 Add a new booking page.

2.3 Edit the booking page that suits your business.

2.4 Create the location for the booking, then set the duration you offer for each session.

2.5 Set the availability of session that you offer to let customers select their preferred session.

2.6 Optional: You may also set the booking form for customers to fill in during booking.

2.7 Create booking page and done.

Embed the Code to Your Webpage

3.1.1 Click “Add to website” button.

3.1.2 Select how you want your booking calendar to appear in the website.

Popup Text

3.1.3 Select Popup Text > Edit the Popup Text > Copy Code

3.1.4 Create a new webpage > Click on code view < / > and paste the embed code inside > un-click code view and save

3.1.5 The outcome will turn out to be like a CTA button

Inline Embed

3.2.1 Select Inline Embed > Copy Code

3.2.2 Add a new “webpage” > paste the embed code in the text area > save

3.2.3 The outcome in website will appear below:

Popup Widget

3.3.1 App > Explore Apps > Install “Insert Code” app

3.3.2 Select Popup Widget > Copy Code

3.3.3 Enter the “Insert Code” app once installed > Tap on “Create Code”

3.3.4 Key in the name you want for this code > Paste the code from Koalendar at the bottom section > Save

3.3.5 Final outcome of popup widget at website.

Updated on: 23/06/2026