Calendar Widget Demo
See appointment booking in action
Embeddable Appointment Booking Calendar
Build-Folio’s calendar widget lets your customers book appointments directly on your website, 24/7. No phone calls, no missed opportunities.
Real-Time Availability
Shows only available time slots based on your business hours and existing bookings
Mobile-Friendly
Fully responsive design works perfectly on phones, tablets, and desktops
Instant Confirmation
Automatic SMS confirmations sent to you and your customer immediately
How It Works
Click “Book Appointment”
Click the floating button in the bottom-right corner to open the calendar
Select a Date
Choose a date from the calendar. Past dates and unavailable days are automatically disabled.
Pick a Time Slot
See real-time availability. Only open time slots are shown based on business hours and existing appointments.
Fill Out Contact Form
Enter name, phone, email, and optional service details. All fields are validated.
Confirmation
Receive instant SMS confirmation. Appointment syncs to your Google Calendar automatically.
SMS Consent Checkbox (What Customers See)
↑ This exact checkbox appears in the live widget above when customers submit their information
Try It Now
This is a live demo using our test organization. Click the “Book Appointment” button to see the calendar widget in action. You can complete the entire booking flow – it’s fully functional!
Your Website Content Goes Here
This represents your normal website content. The calendar widget floats on top as a non-intrusive button that your visitors can click to book appointments anytime.
Sample Business Info
Key Features
Double-Booking Prevention
Automatically blocks time slots when booked. No conflicts or scheduling mistakes.
Customizable Business Hours
Set your available hours, slot duration (15/30/60 min), and buffer time between appointments.
SMS Confirmations
Both you and your customer receive instant text confirmations with appointment details.
Google Calendar Sync
Appointments automatically sync to your Google Calendar with customer details.
Lead Capture
Every booking creates a lead in your Build-Folio dashboard with full contact info and service type.
Event Tracking
See analytics on widget opens, date selections, and booking conversions in your dashboard.
Easy Installation
Add the calendar widget to your website with just one line of code:
<script src="https://build-folio-api.fly.dev/widget/calendar.js"
data-org-id="build-folio-pro-tester-14b8b1bd"
data-primary-color="#FF6B35"
data-button-text="Book Appointment"></script>
Customization Options:
data-org-id– Your organization ID from Build-Folio dashboarddata-primary-color– Button color (default: #FF6B35)data-button-text– Button text (default: “Book Appointment”)data-position– Button position: “bottom-right” or “bottom-left”
Ready to Add This to Your Website?
Get Build-Folio Professional and start capturing appointments 24/7