Booking Widget
Insert a complete booking widget in your website with just a few lines of code.
Introduction
The SalonBookIt widget is a JavaScript component you can integrate into any web page. It allows your customers to:
- View your services and prices
- Select a professional
- Choose available date and time
- Complete the booking and pay online
Features
Fully responsive
Automatically adapts to any screen size.
Customizable
Adjust colors, texts and behavior to your brand.
Integrated payments
Process payments with Stripe directly from the widget.
Multi-language
Available in Spanish, English and Arabic.
Optimized performance
Less than 50KB, asynchronous loading.
Secure
HTTPS communication, secure tokens.
Display modes
The widget can be displayed in three different ways according to your needs:
Inline
The widget is displayed directly in a container on your page. Ideal for dedicated booking pages.
mode: 'inline'
Modal
The widget appears in a centered popup when clicking a button. Less intrusive.
mode: 'modal'
Button
Only shows a floating button. When clicked, opens the widget in modal.
mode: 'button'
Quick start
<!-- Container -->
<div id="salonbookit-widget"></div>
<!-- Script -->
<script src="https://app.salonbookit.com/static/widget/v1/salonbookit-widget.min.js"></script>
<script>
SalonBookIt.init({
apiKey: 'YOUR_API_KEY',
container: '#salonbookit-widget'
});
</script>
For more configuration options, check the configuration guide.
Compatibility
The widget is compatible with all modern browsers:
| Browser | Minimum version |
|---|---|
| Chrome | 60+ |
| Firefox | 55+ |
| Safari | 12+ |
| Edge | 79+ |
| Mobile Safari (iOS) | 12+ |
| Chrome for Android | 60+ |