We're excited to introduce Embeddable Widgets, bringing the complete Lilikoi booking experience directly to your website. Whether you're running a rafting company, bike tour business, or adventure outfitter, you can now accept bookings without sending customers to a separate booking page.
Included in Your Subscription
Widgets are included with your Lilikoi subscription at no additional cost. Accept bookings directly on your website with the same straightforward pricing you already have - no widget fees, no integration charges, no surprises.
Four Widget Types for Every Use Case
🎯 Booking Flow Widget
The complete booking experience embedded on your site:
- Product selection and details
- Real-time availability calendar
- Customer information collection
- Secure payment processing
- Instant booking confirmation
Perfect for dedicated booking pages or product pages where you want the full experience.
🔘 Book Button Widget
A simple button that opens the complete booking flow:
- Clean, minimal footprint on your page
- Customizable button text and styling
- Opens booking flow when clicked
- Great for hero sections and CTAs
Ideal for landing pages where you want a prominent call-to-action without taking up space.
📅 Availability Calendar Widget
Show your availability at a glance:
- Month-view calendar with available dates
- Time slot selection
- Real-time updates
- Direct booking from calendar
Perfect for customers who want to browse availability before committing.
🗂️ Product Catalog Widget
Showcase all your experiences:
- Grid view of all products
- Filtering by category
- Prices and descriptions
- Individual booking buttons
Great for main booking pages where customers want to see all options.
Three Display Modes
Inline Mode
Embed directly on your page for a seamless experience. The widget becomes part of your page layout, inheriting your workspace colors and branding. Perfect for dedicated booking pages.
Popup Mode
A button on your page that opens a modal overlay. Keeps customers on your site while providing a focused booking experience. Great for product pages and blog posts.
Fullscreen Mode
Opens an immersive full-screen booking experience. Removes all distractions and guides customers through the booking process. Ideal for mobile users and conversion-focused pages.
Automatic Branding and Theming
Widgets automatically match your workspace branding:
- Your primary color scheme
- Light and dark mode support
- Custom fonts and styling
- Background and text colors
Or customize each widget individually with theme overrides for different pages or campaigns.
Built for Performance
We've optimized widgets to load fast and stay fast:
Cache Warming - Data is pre-fetched before the widget even loads, so customers see availability instantly instead of waiting for API calls.
Global CDN - Widgets are served from Cloudflare's global edge network, meaning sub-100ms load times worldwide.
Non-blocking Analytics - We track widget interactions without slowing down the booking process.
Optimized Bundle - The entire widget library is just 38.5 kB (8.5 kB gzipped) - smaller than most images on your site.
Simple Integration
Adding a widget to your site takes two steps:
- Add the script to your page:
<script src="https://lilikoi-widgets.com/lilikoi-widgets.js"></script>
- Configure and mount the widget:
<div id="booking-widget"></div>
<script>
LilikoiWidget.mount({
target: '#booking-widget',
type: 'booking-flow',
mode: 'inline',
workspaceSlug: 'your-workspace',
publicKey: 'your-api-key',
productId: 'your-product-id'
});
</script>
That's it. No build process, no dependencies, no complicated setup.
Widget Settings in Your Dashboard
Manage all your widgets from your workspace settings:
- Live preview of each widget type
- Copy-paste embed code
- API key management
- Theme customization
- Real-time configuration updates
Test different configurations and see exactly how they'll look on your site before you deploy.
Secure and Reliable
API Key Authentication - Each widget uses workspace-scoped API keys. Keys are safe for public use and can be rotated anytime.
PCI Compliance - Payment processing happens through Stripe with full PCI compliance. We never see or store card numbers.
99.99% Uptime - Widgets are served from Cloudflare Workers with automatic failover and global redundancy.
All Your Booking Models Supported
Widgets work with all Lilikoi booking models:
- Scheduled experiences with fixed start times
- Timed entry for flexible arrival windows
- Flexible bookings for date-range experiences
- Allocation pool for shared resources
- Multi-day fixed itineraries
- Multi-day flexible adventures
- Request-only bookings
- Appointment-based scheduling
Built-in Analytics
Track how customers interact with your widgets:
- Widget loads and views
- Button clicks and interactions
- Booking starts and completions
- Product selections
- Date/calendar interactions
- Error events
Analytics are optional and can be enabled per widget. Supports Google Tag Manager and custom analytics integrations.
Best Practices
Start with Inline Mode on your main booking page to give customers the complete experience without leaving your site.
Use Book Buttons on product pages and blog posts to reduce friction while keeping your content visible.
Show the Availability Calendar on your homepage or FAQ page so customers can check dates before diving into the booking flow.
Match Your Brand by customizing the primary color to match your website. Widgets will automatically adapt to your color scheme.
Test on Mobile - Most adventure bookings happen on mobile devices. All widget modes are fully responsive and optimized for small screens.
Getting Started
Widgets are available now in your workspace settings:
- Go to Settings → Widgets
- Generate an API key (or use an existing one)
- Configure your first widget with live preview
- Copy the embed code
- Add it to your website
What's Next
We're working on additional widget features:
- Custom CSS overrides for advanced styling
- Multi-language support
- Gift card and package widgets
- Webhook events for booking notifications
- Advanced analytics dashboard
Questions?
Check out our widget documentation ↗ for detailed setup guides, API reference, and troubleshooting tips. Or reach out to our support team - we're here to help you get set up.
Start accepting bookings on your website today. Log in to enable widgets for your workspace.