G-GuestG-Guest

G-Guest · your website

Put the booking form on your website

One line of code, about two minutes, nothing to install. If somebody else looks after your website, forward them this page and everything they need is on it. They need nothing from your panel.None of this is required. Your reservation page is live either way, and plenty of venues just link to it. This is for when you would rather people booked without leaving your site.
  1. 1

    The line

    This is the whole installation. YOUR-SLUG is in your welcome email. It is the short name at the end of your reservation page address.
    <script src="https://g-guest.app/cal-widget.js" data-cal="YOUR-SLUG" defer></script>

    Nothing else is needed: no account, no API key, no library, no build step. It is about two kilobytes and it loads after your page has drawn itself.

  2. 2

    Where it goes

    Anywhere in the page, but the safest place is just before the closing </body> tag, or in whatever your site calls its custom-code box:
    • WordPress, Appearance → Theme File Editor → footer.php, or any header-and-footer-scripts plugin you already have.
    • Squarespace: Settings → Advanced → Code Injection → Footer.
    • Wix: Settings → Custom Code → Add code to Body end.
    • Tilda: Site settings → More → HTML code for the <body> end. For a specific page, block T123.
    • Webflow: Project settings → Custom code → Footer code.

    Put it site-wide and the button can appear on every page; put it on one page and it only appears there.

  3. 3

    Choose how it appears, three ways

    Same line, three behaviours. Pick the one that suits the page you are putting it on.

    A. A button we draw — the default

    Add nothing and a Book a table button appears exactly where you put the line. Tapping it opens the booking form over your page. Simplest, and right for a header or a footer.

    B. The form itself, on the page: data-inline

    No button and no pop-up: the whole booking form is rendered right where the line sits. This is what most venues want on a dedicated Reservations or Timetable section, and it is what we use on the sites we build ourselves.

    <script src="https://g-guest.app/cal-widget.js" data-cal="YOUR-SLUG" data-inline defer></script>

    Give it a full-width section — it fills whatever width it is handed.

    C. Your own button: data-glab-book

    Already have a Book button that matches your design? Keep it. Put data-glab-book on that element and we attach to it instead of drawing our own: the booking form opens from your button, styled entirely by you. Works on as many elements as you like with a single script line.

    <a href="#" data-glab-book class="your-own-button">Book a table</a>
  4. 4

    Make it match your site

    Only relevant for option A, the button we draw. All three are optional.
    • data-label="Book a class", the button’s text. A studio, a salon and a clinic all want a different word here.
    • data-accent="#1F6F5C": the button’s colour. Your brand colour, in hex.
    • data-theme="dark": switches the booking form itself to its dark look, for a dark site.
    <script src="https://g-guest.app/cal-widget.js" data-cal="YOUR-SLUG" data-label="Book a class" data-accent="#1F6F5C" data-theme="dark" defer></script>
  5. 5

    Check it worked, in two minutes

    Open the page in a normal browser window and book something for tomorrow, as a guest would. Three things should happen:
    • you get the confirmation, as the guest;
    • the booking appears in the venue’s panel;
    • it pings the phones connected to alerts.

    Then cancel it from the panel. That is the whole loop, proven end to end. Do check it on a phone as well. That is where most of your bookings will come from.

  6. If something is off

    Nothing appeared on the page

    Three things, in this order. Is the line actually on the page? Open the site, view source, search for cal-widget: some site builders strip <script> tags out of ordinary text blocks, and only the custom-code box survives. Is the slug right? It is case-sensitive and it is in your welcome email. Is there a content blocker? Some security plugins block third-party scripts by default; allow g-guest.app, and g-lab.studio too if your snippet is an older one that names it. If all three look right, send us the address and we will look at it ourselves.

    It shows up twice

    The line is on the page twice, usually once in the theme footer and once in a page-level code block. Remove one. If you deliberately want two entry points on one page, use data-glab-book on both elements and keep a single script line.

    Will it slow the site down?

    It is about two kilobytes, it carries no framework and no dependencies, and it is loaded with defer, so it never blocks the page from rendering. The booking form itself only loads once somebody opens it.

    What happens to our site if the subscription ends?

    Nothing breaks and nothing looks broken. The widget asks us whether the venue is live before it draws anything: while a venue is paused it degrades to a simple request form, and a retired one renders nothing at all, no empty box, no error, no dead button. You would never have to go back into your site to tidy up after us.

    Does it work on a phone?

    Yes, and most bookings arrive from one. The form is built for a phone first; inline mode fills the width it is given, so put it in a full-width section rather than a narrow column.

    We use a page builder and there is no place to paste code

    Most have one, and it is usually called Custom code, Embed, HTML block or Header and footer scripts. If you cannot find it, tell us which builder you are on and we will point you at the exact screen. They all have one, and they all hide it somewhere different. And you do not have to solve this at all: your reservation page works regardless, and many venues simply link to it.

Not working? Send us the address of the page and a note of where you pasted the line, and we will tell you exactly what to change. That counts as support, not as a favour.

Stuck anywhere? Message G-Lab Support on Telegram (@G_Lab_Supportbot) and we’ll do it with you, even on a quick screen-share. A real person answers, any day.