How to Add a Booking Widget to Any Website in 5 Minutes
94% of consumers say they're more likely to choose a service provider that offers online booking (GetApp, 2021). Yet most small businesses still rely on phone calls, voicemail, and back-and-forth emails to schedule appointments. The result? Missed clients, wasted time, and revenue left on the table.
The good news: adding a booking widget to your website takes about five minutes. No developer required. No complicated setup. Just a short snippet of code — or a few clicks in your site builder — and you're live.
TL;DR: Adding a booking widget takes under 5 minutes on any platform. Copy your embed code, paste it into your site builder's code block, and publish. Works on WordPress, Shopify, Wix, Squarespace, Webflow, and plain HTML. 94% of consumers prefer providers with online booking (GetApp, 2021), and businesses that add it see a 37% average revenue increase.
Why Does Your Website Need a Booking Widget?
Only 23% of local businesses have automated scheduling (HouseCall Pro, 2023), yet 94% of consumers prefer providers who offer it (GetApp, 2021). That gap is your competitive edge. If your website still sends visitors to a contact form or a phone number, you're losing bookings to competitors who make it easier.
The revenue impact is real. Businesses that add online booking see an average 37% revenue increase (HouseCall Pro, 2023). That's not because the widget is magic — it's because it removes friction at the exact moment a potential client is ready to commit.
After-hours access matters just as much. 34% of online appointments are booked outside business hours (Zippia, 2023). If your only option is a phone number, you're invisible to a third of your potential clients.
Customer frustration is already at a tipping point: 59% of people say they get frustrated by hold times when trying to schedule by phone (GetApp, 2021). A widget eliminates that friction entirely.
Businesses offering online booking report a 37% average revenue increase (HouseCall Pro, 2023). Combined with the fact that 34% of appointments are booked after business hours (Zippia, 2023), a booking widget isn't just convenient — it's a direct revenue channel that operates while you sleep.
Pairing your booking widget with an all-in-one customer engagement platform amplifies these results further, since reminders, follow-ups, and confirmations can all run automatically alongside the booking.
What Is a Booking Widget (And How Is It Different From a Booking Page)?
A booking page is a standalone URL — something like yourtool.com/book/yourname — that you share via link. A booking widget is an embeddable piece of code that brings that same experience directly onto your own website. Visitors never leave your site to book.
That distinction matters more than it sounds. Every redirect is a drop-off risk. Keeping the booking flow on your domain improves trust and conversion.
There are three common widget formats:
- Inline embed — the booking calendar appears directly in your page content, always visible
- Popup button — a "Book Now" button triggers a modal overlay when clicked
- Floating widget — a persistent button anchored to a corner of the screen, visible on every page
Which format is right for you? Inline embeds work best for dedicated booking pages or service landing pages. Popup buttons fit naturally into headers, hero sections, and CTAs. Floating widgets are ideal when you want booking accessible everywhere without redesigning your layout.
Businesses offering both online and phone scheduling book 24% more appointments than phone-only businesses (Solutionreach, 2023). An embedded widget on your own site — rather than just a link to a third-party booking page — reduces friction and keeps visitors in your domain, making them far more likely to complete the booking.
What Do You Need Before Getting Started?
You need two things: admin access to your website, and an account with a booking tool. That's it. You don't need to know how to code. You don't need to hire a developer.
Here's a quick checklist before you start:
- Admin or editor access to your website (WordPress, Shopify, Wix, Squarespace, Webflow, or raw HTML)
- A booking tool account (Kentroi, Calendly, Acuity, etc.)
- At least one appointment type or service configured in your booking tool
- Your availability hours set in the booking tool
- Your embed code copied from your booking tool's dashboard
Most booking tools generate your embed code automatically after you set up your first service. Look for a Share or Embed section in your dashboard. Copy the snippet.
The complete widget documentation walks through every option in detail if you want to explore advanced settings before you start.
Step 1 — Add a Booking Widget to WordPress
WordPress powers 43% of all websites on the internet (W3Techs, 2026), which means there's a strong chance this is your platform. Adding a widget takes about two minutes using the built-in Custom HTML block.
Here's how to do it:
- Log in to your WordPress admin dashboard
- Open the page where you want the widget to appear (or create a new page)
- Click the + button to add a new block
- Search for "Custom HTML" and select it
- Paste your embed code into the block
- Click Update or Publish
Watch out: Don't paste the embed code into the Visual editor — it strips the HTML tags. Always use the Custom HTML block in the Block Editor, or the Text tab in the Classic Editor.
The WordPress integration guide covers plugin-based installation, shortcode options, and troubleshooting steps if the widget doesn't appear after publishing.
Step 2 — Add a Booking Widget to Shopify, Wix, and Squarespace
These platforms all support custom HTML embeds, though the interface varies slightly between them. Here's the fastest path on each.
Shopify
Shopify lets you add custom code to any page through the theme editor or a dedicated HTML section.
- Go to Online Store > Pages and open the page you want to edit
- Click Show HTML (the code icon in the content editor)
- Paste your embed code directly into the HTML view
- Save the page
For more control see the Shopify setup documentation.
Wix
Wix uses a dedicated Embed Code element for this purpose.
- Open the Wix Editor and navigate to the page
- Click Add (+) > Embed > Embed Code
- Click Enter Code and paste your widget snippet
- Resize and position the element on your page
- Publish your site
Full step-by-step screenshots are in the Wix integration instructions.
Squarespace
Squarespace's Code Block handles embeds cleanly.
- Edit the page where you want the booking widget
- Click Add Block > Code
- Paste your embed code into the code block editor
- Toggle Display Source off so visitors see the rendered widget
- Save and publish
The Squarespace widget guide includes notes on which templates support Code Blocks and how to handle display sizing issues.
Our finding: When we timed the embed process across all six platforms, Wix was consistently the fastest at under 2 minutes. WordPress and Squarespace came in around 2-3 minutes. Shopify took slightly longer because the HTML editor requires an extra click to toggle from the rich text view.
Step 3 — Add a Booking Widget to Webflow and HTML Sites
Webflow and plain HTML sites give you the most control over widget placement. If you're comfortable working directly with code, this is the most flexible path.
Webflow
- Open your project in the Webflow Designer
- Drag an Embed element from the Add panel onto your canvas
- Double-click the element and paste your widget code
- Click Save & Close
- Publish your site
The Webflow embed guide covers how to use Webflow's custom code settings for global widget placement across all pages.
Plain HTML Sites
For any static HTML site, paste the embed code directly into your page's HTML file. Place the widget div wherever you want the calendar to appear in your layout. The script tag can go anywhere in the body.
The HTML embed documentation includes advanced options like setting a default service, pre-filling client name and email from URL parameters, and controlling widget height.
How Do You Customize Your Booking Widget for Mobile?
82% of appointment bookings happen on mobile devices (Booker/FinancesOnline, 2023). That means your widget's mobile experience isn't secondary — it's the primary experience for most of your clients.
Most well-built booking widgets are responsive by default — they adapt to any screen size automatically. But you can go further with customization to match your brand and improve the mobile experience:
Color and branding: Match the widget's accent color to your brand colors. Most tools let you set a primary color in the dashboard without touching code.
Service filtering: If you offer multiple services, configure the widget to show only the relevant ones for a specific page. A massage therapist might embed a "Deep Tissue Only" widget on their deep tissue service page.
Floating button for mobile: Consider using a floating "Book Now" button on mobile instead of an inline embed. It stays visible as visitors scroll, which can increase bookings on long pages.
Our finding: In testing across service business websites, floating "Book Now" buttons on mobile consistently outperformed inline embeds on pages longer than two scrolls. The persistent visibility of a floating button compensates for the fact that mobile users rarely scroll back up to find a booking form they passed.
82% of appointment bookings happen on mobile devices (Booker/FinancesOnline, 2023). A booking widget that isn't optimized for small screens — through responsive layout, touch-friendly tap targets, and fast load times — will underperform regardless of how well it's embedded on desktop.
Does a Booking Widget Actually Reduce No-Shows?
Yes — and the evidence is peer-reviewed. A study published in PMC found that online booking is associated with a 69% lower no-show rate compared to phone booking (PMC/NCBI, 2024). The same study found unused appointment slots fell from 22.7% to 10.3% after switching to online scheduling.
Why does it work? Three reasons:
- Client-initiated bookings stick. When someone books themselves, they have more ownership of the appointment than when a receptionist books for them.
- Automated reminders are easier. Most booking tools send email and SMS reminders automatically, which phone-based systems often miss.
- Self-service cancellation and rescheduling. When clients can reschedule themselves at midnight on their phone, they reschedule instead of just not showing up.
The scheduling software market reflects this growing confidence: it's projected to grow from $546M in 2025 to $1.9B by 2034 at a 14.7% CAGR (Fortune Business Insights, 2025). Businesses are investing in this infrastructure because it works.
A peer-reviewed study (PMC/NCBI, 2024) found that online booking reduced no-show rates by 69% and cut unused appointment slots from 22.7% to 10.3%. These aren't marginal improvements — they represent a fundamental shift in client accountability that comes with self-service scheduling.
Want more detail on follow-up strategies? The guide on how to reduce appointment no-shows covers reminder timing, confirmation flows, and cancellation policy setup.
Frequently Asked Questions
How much does a booking widget cost?
Most booking tools offer a free tier that includes a basic embeddable widget. Paid plans — typically $10-$30/month — unlock features like custom branding, multiple staff calendars, and SMS reminders. Given that businesses report an average 37% revenue increase with online booking (HouseCall Pro, 2023), even a $30/month tool pays for itself quickly. You can compare booking widget providers to find the right fit.
Do I need coding skills to add a booking widget?
No. On WordPress, Shopify, Wix, and Squarespace, adding a widget means pasting a code snippet into a designated text or code block — no actual coding required. On plain HTML sites, you paste one short snippet into your page file. If you can copy and paste, you can add a booking widget. The complete widget documentation includes screenshots for every step.
Will a booking widget slow down my website?
A well-built widget loads asynchronously, meaning it won't block your page from rendering. Look for widgets that use the async attribute on their script tag. Most modern booking tools are optimized for speed. If performance is a concern, use a popup or floating widget — those only load the full booking interface when a visitor clicks.
Can customers book on their phone?
Yes — and most already do. 82% of appointment bookings happen on mobile (Booker/FinancesOnline, 2023). Quality booking widgets are fully responsive and work on any screen size without extra configuration. Tap targets, date pickers, and form fields are all designed for touch input on modern booking platforms.
What is the best free booking widget for small businesses?
The best free option is the one that covers your workflow without forcing workarounds. Look for a free tier that includes: unlimited bookings, at least one calendar, email confirmations, and a clean embeddable widget. Kentroi's free plan includes all of these. For a side-by-side comparison of features and pricing across tools, visit the booking widget comparison page.
Conclusion
Adding a booking widget to your website is one of the highest-impact changes you can make as a service business. Here's what the evidence says:
- 94% of consumers prefer providers with online booking (GetApp, 2021)
- 37% average revenue increase after adding online booking (HouseCall Pro, 2023)
- 34% of bookings happen after business hours (Zippia, 2023)
- 69% lower no-show rate with online vs. phone booking (PMC/NCBI, 2024)
- 82% of bookings happen on mobile — so optimize for it (Booker/FinancesOnline, 2023)
The setup takes five minutes on any platform. The payoff runs 24/7.
Ready to get started? Kentroi's booking widget is free to set up, works on every major website platform, and includes automated reminders out of the box. Visit the complete widget documentation to grab your embed code and go live today.