Booking widget
Add a booking widget to your website
One line of code puts a working booking form on any page. Or a button that opens it in an overlay. Or just a link. No plugin, no developer, no monthly widget fee. It is included on every Tablez plan, including Free.
Try it
Pick a style and copy the code
Type your venue's slug (the last part of your booking link) and the code updates. The demo venue is demo-arms.
Paste this where you want the booking form to appear. It grows to fit and matches your page width.
<script src="https://tablez.uk/embed.js" data-venue="your-venue"></script>Adds a "Book a table" button in your accent colour. Clicking it opens the booking page in an overlay. Change the label and colour if you like.
<script src="https://tablez.uk/embed.js" data-venue="your-venue" data-mode="button" data-label="Book a table" data-colour="#0f5c4c"></script>Any existing button or link can open the overlay too. Give it the class tablez-open and a data-venue attribute, and load the script once anywhere on the page.
For builders that only allow an iframe. Set the height to suit; 760px fits the whole form on most screens.
<iframe src="https://tablez.uk/book/your-venue?embed=1" title="Book a table" style="width:100%;height:760px;border:0"></iframe>No website changes at all. Use this anywhere: menus, Google, Instagram, email signatures. Your venue also has its own short address, like yourpub.tablez.uk on Starter and above (a random code such as 5434.tablez.uk on Free), which goes to the same page and is easier to say out loud.
https://tablez.uk/book/your-venueWhich style should you use?
Inline is best if you have a "Book" page or a spare section on your home page. The form sits in the page, resizes itself as the customer moves through it, and looks like part of your site. Button is best if you do not want to change your layout: it drops a button where you paste the script and the form opens over the top of the page. Iframe is for builders that strip scripts but allow embeds. Link is for everywhere else.
All four go to the same booking page, so a customer gets exactly the same experience however they arrive. You can use several at once, for example inline on your bookings page and a button in the header.
How it works under the hood
The script creates an iframe pointing at your booking page in embed mode, which hides the header and footer and uses a transparent background. The booking page tells the parent page its height as the customer moves through, so there is never a scroll bar inside a scroll bar. Nothing else on your page is touched. The script is under 4KB, loads after your content, and sets no cookies on your site.
Because the form runs on tablez.uk, you never handle customer data on your own site and never need to update anything when we improve the booking page. Your embed code stays the same for good.
Does it work with my website builder?
Yes, if it lets you paste HTML. That is almost everything:
- WordPress: paste into a Custom HTML block. No plugin needed.
- Squarespace: a Code block on any page.
- Wix: an Embed HTML element, or a button linking to your page.
- Shopify: a Custom Liquid section or a page in HTML view.
- Webflow, GoDaddy, Weebly, Jimdo, Carrd, Framer: their embed or HTML element.
- Plain HTML someone built years ago: paste it in a text editor and upload.
Google Sites and a few free builders strip scripts. Use the iframe or the link there.
Making it look like yours
In your Tablez dashboard, set an accent colour and upload a logo. The embedded form uses them. The booking page has very little of its own styling beyond that, so it sits comfortably on light and dark sites alike. If you want the "Book a table" button to match your site's own buttons exactly, skip the generated button and use the tablez-open class on one of yours.
Mobile
The form is built for phones first, since that is where most bookings happen. Inline, it takes the full width of a phone screen. The button overlay fills the screen on a phone and sits in a centred panel on a desktop. Test it on your own phone after adding it; the live demo shows what to expect.
FAQ
Questions about the widget
Is the widget free?
Yes, on every plan including Free. It is part of the product, not an add-on.
Where do I find my venue slug?
In your dashboard under Booking page. It is the last part of your booking link, for example the-old-mill in tablez.uk/book/the-old-mill. Your venue also has its own subdomain, such as the-old-mill.tablez.uk on Starter and above, with a QR code and poster ready to print in the dashboard.
Will it slow my website down?
No. The script is tiny and loads after your page. The form itself loads inside its own frame and does not block anything on your page.
Does it show "Powered by Tablez"?
On the Free plan a small line appears at the bottom of the form. On Starter and Pro it is removed.
Can I put it on more than one page or site?
Yes, as many as you like. Same code everywhere.
What if my site is HTTPS and yours is not, or the other way round?
Tablez is HTTPS only, and the embed works on both HTTP and HTTPS sites. If your site is still HTTP, it is worth fixing that anyway.
Get your embed code
Sign up free, add your tables, and your code is waiting in the dashboard.
Start free