Aurinko offers a prebuilt calendar booking page seamlessly integrated with its Booking API. This page streamlines the scheduling process for you and your clients, offering a user-friendly interface for booking appointments based on your defined availability profiles.

Image Placeholder

Key Features:

  • Availability-Driven Booking: Clients can only select time slots based on the pre-defined availability profiles.

  • Seamless Integration: Works seamlessly with the Aurinko Booking API, managing bookings effortlessly.

  • Customization Options: While offering a default design, the page follows the essential branding attributes specified for your Aurinko app (see Settings in the Aurinko portal).

  • Client-Centric Design: Intuitive interface ensures smooth and hassle-free booking for your clients.


Quick Start:

  • Test Drive: Experience the prebuilt booking page firsthand through Aurinko’s portal: Create Your First Appointment Booking Page.

  • Sample Code: Explore the open-source project showcasing the scheduler page:

    
<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>Book</title>
    <link rel="stylesheet" href="https://example.aurinko.io/scheduler/assets/salesforce-lightning-design-system.min.css">
    <link rel="stylesheet" href="https://example.aurinko.io/scheduler/assets/styles.css">
</head>

<body id="appContainer">
        
    <script>
        var auClientId="{{YOUR_AURINKO_CLIENT_ID}}"
        var defaultProfileName="{{YOUR_DEFAULT_PROFILE_NAME}}"
    </script>

    <script type="text/javascript" src="https://example.aurinko.io/scheduler/scheduler.js"></script>
</body>

</html>


Integration:

Host the sample calendar page at your domain, i.e. calendar.mydomain.com, and specify {{YOUR_AURINKO_CLIENT_ID}} in the index.html file. {{YOUR_DEFAULT_PROFILE_NAME}} is optional.

Alternatively, we can host this page for you and associate your domain alias with your app’s clientId.

In either case, add your domain to the list of trusted domains in your Aurinko portal:

Image Placeholder

  • You can view calendar availability for a given booking profile by specifying the profile’s name in the URL path: https://calendar.mydomain.com/{profileName}. Those links are convenient for sharing by email.

  • If you deploy the calendar page at a path then use hash segments to specify a profile and other parameters, i.e. https://myapp.mydomain.com/pathTo/calendarPage/#profile={profileName}. You can specify your clientId this way too.

  • Our code always looks for the hash segment parameters first; then considers the path to be a profile name.

If you need to integrate the page into your existing website we recommend using an iframe which your code can redirect to different profiles as needed:

<iframe id="myIframe"></iframe>

<script>
  document.getElementById("myIframe").src = "https://calendar.mydomain.com/#profile={profileName}";
</script>

For other custom integration scenarios please reach out to us at support@aurinko.io.