Add a Booking System to Your Website: Every Widget Explained
Popup widgets, iframe embeds, direct links, per-location widgets and a floating AI chat — add booking to Wix, WordPress, Squarespace or any platform in minutes.
How to take bookings online: the complete solution
Searching for how to add booking to your website? Whether you're on Wix, WordPress, Squarespace, or any website builder, GetaBooking gives you a full set of copy-paste widgets — no coding required.
Your customers expect to book instantly — at 11pm on a Sunday, during a lunch break, or straight after seeing a social post. If they have to call during office hours or wait for a reply, they book elsewhere.
This guide covers every widget option GetaBooking offers, where each one fits, and exactly how to add it. You'll find all of these ready to copy in your dashboard under Website Content → Widgets.
Real customer success
We embedded our floating booking widget on a Wix website for a customer using our Pro Service offering. The widget appears across their whole site on mobile and desktop, loading in under a second.
Want to see a live customer example first? Read the Halora spotlight.
Where to find your widgets
Everything in this guide is generated for you, pre-filled with your business name, in Website Content → Widgets. That page gives you:
- Your unique widget codes — pre-configured, nothing to edit
- A "View Code" and "Test Widget" / "Preview" button on every option so you can see it before you embed
- Per-service direct links with copyable button and popup HTML
- A toggle to disable your GetaBooking site and redirect visitors to your own website — widgets and embeds keep working
You never write code yourself — copy the snippet and paste it into your site. The widget shows your live services, availability and branding, and handles payment.
Popup widgets (a Book Now button that opens an overlay)
Popup widgets open your booking system in a clean overlay when a customer clicks a button, then return them to your page. Ideal for navigation and "Book Now" buttons. Each one is a button plus a one-line script — just swap the view:
- Full Widget — the complete booking experience with hero section, services and about info
- Compact Widget — services and booking without the hero section
- Minimal Widget — services only, the most compact option
- Calendar Widget — opens straight to the month calendar view
- Clean Widget — services with a calendar that expands when clicked
- Clean2 Widget — shows availability slots immediately, the fastest route to a booking
<button id="booking-button">Book Now</button>
<script src="https://getabooking.co.uk/widget.js"></script>
<script>
document.getElementById('booking-button').addEventListener('click', function () {
GetaBooking.openClean2('your-business'); // or open / openCompact / openMinimal / openCalendar / openClean
});
</script>Tip: the easiest approach is the data-attribute button shown in the dashboard — paste the snippet and widget.js wires the click for you, no JavaScript needed.
Iframe embeds (booking built into your page)
An iframe places the booking system directly inside a page — it looks like part of your site and scrolls with your content. Best when booking is the main purpose of the page. The same seven views are available as embeds:
- Full View — complete booking page with hero, services, about section and footer
- Compact View — services and booking without the hero, great below your own header
- Minimal View — services only, perfect alongside your own content
- Service Group View — show one service group only (replace GROUP_NAME with your group)
- Calendar View — month calendar with availability dots and bookable time slots
- Clean View — services with an expandable calendar, clean and minimal
- Clean2 View — services with availability visible immediately, the fastest booking experience
<iframe
src="https://getabooking.co.uk/your-business?view=clean2"
width="100%"
height="1000px"
frameborder="0"
style="border: none; border-radius: 8px;">
</iframe>- Adjust the height to fit your content (800px–1200px recommended)
- Use width="100%" for a responsive embed
- Shows real-time availability and handles bookings and payment directly
Direct button links (one service, one link)
Every service gets its own direct link, e.g. getabooking.co.uk/your-business/book/your-service. In Website Content → Widgets (and in Marketing Support) each service offers:
- Copy Link — the plain URL for any button, bio, message or QR code
- Copy Button HTML — a ready-made styled "Book" button you can paste straight in
- Copy Popup HTML — the same button, but it opens the service in a booking popup instead of redirecting
There's also a Membership Page link (when memberships are enabled and Stripe is connected) with its own copyable link and button HTML.
Multi Site Locations (a widget per venue)
If you run at more than one venue, each location gets its own booking widget. Each one opens the calendar filtered to that location's services — as a popup or an embedded iframe — so a "Book at [venue]" button on each venue page opens exactly the right calendar.
- Per-location popup and iframe — both are generated for every location under "Multi Site Locations"
- Shareable per-location links — also available in Marketing Support with Copy link and Get QR Code
- Keep location names identical across services at the same venue so they group under one widget
Floating AI chat widget
A floating chat bubble you can add to any website. It reads your services and knowledge files to answer customer questions 24/7 and point them to booking.
- Appears in the bottom-right corner on any site
- Always available on your GetaBooking site when activated
- Some builders (e.g. Wix, Squarespace) may block floating widgets — test after embedding to confirm compatibility
Which should you use?
Use iframe embeds when booking is the main purpose of a page — a dedicated booking page, a service page, or a campaign landing page.
Use popup widgets when booking is one of several actions — navigation buttons, calls-to-action, or a homepage hero button, without the booking system dominating the page.
Use direct links for a single service anywhere (bios, messages, QR codes), and per-location widgets when you operate from more than one venue. Many businesses combine several — popups for navigation, an iframe on the booking page, and direct links in social bios.
Clean booking links: two quick options
GetaBooking offers two "clean" link formats. Both work everywhere — websites, Facebook, Instagram, email, SMS, QR codes and print.
Clean view: choose a day first
https://getabooking.co.uk/your-business?view=cleanShows your services with a calendar button. Customers pick a service, choose a day, then see times. Good for weekly schedules and classes.
Clean2 view: next available times
https://getabooking.co.uk/your-business?view=clean2Shows services with availability slots visible immediately, in date order, so customers can book the next slot instantly. Good for high-volume services and "Book Now" buttons.
Both views load fast, work on mobile, carry your full branding, and handle payment with automated confirmations and calendar integration.
Frequently Asked Questions
Does the booking widget work with Wix, WordPress and Squarespace?
Yes. The widgets are plain HTML and a single script, so they work on Wix, WordPress, Squarespace, Shopify, and custom-built sites. You paste an iframe snippet or a Book Now button with one line of script — no plugin required. Some builders restrict floating widgets, so test the floating AI chat after embedding.
What's the difference between an iframe embed and a popup widget?
An iframe places the booking system inside a page so it looks like part of your site — best when booking is the main purpose of that page. A popup opens booking in an overlay when a button is clicked, then returns the customer to your page — best for navigation and Book Now buttons. You can use both.
Can I embed booking for just one location or one service?
Yes. Each service has its own direct link and popup/button HTML, and each location has its own popup and iframe widget under Multi Site Locations — so a venue page can open the calendar filtered to just that venue's services.
Do I need to write any code?
No. Every widget is generated for you in Website Content → Widgets, pre-filled with your business name, with View Code and Preview/Test buttons. You copy the snippet and paste it into your site.
Interested in giving it a try?
Sign up now — 14 days free, no card required.
Visit our homepage for more informationRelated reading