On this page
English
Sections

Integration guide

Add HappyChef to your own website with copy-paste code. Your restaurant ID is filled in automatically when you are logged in.

Overview & your restaurant ID

Add HappyChef to your own website with copy-paste code. You never call our servers directly — you simply embed our hosted booking page, reservation widget or gift card flow. We handle availability, payments, security and updates for you. When you are logged in to HappyChef, every snippet below is filled in with your own restaurant ID automatically; if not, replace YOUR_RESTAURANT_ID with your ID.

  • Works with any website or website builder that lets you paste HTML.
  • Your restaurant ID is the identifier shown in the snippets — it is filled in automatically when you are signed in.
  • No server-side setup, keys or maintenance required on your side.

Booking page (iframe)

Embed the full HappyChef booking page directly in your website. Guests pick a date, time and party size and reserve without leaving your page.

<iframe src="https://happychef.cloud/book/?restaurantId=YOUR_RESTAURANT_ID" style="width:100%;height:90vh;border:none;"></iframe>
  • Adjust width and height to fit your layout.
  • The form is responsive and works on mobile.
  • Availability, pacing and confirmations are handled automatically.

Reservation widget (script)

Add a floating “Reserve” button to any page with a single script tag. It opens the booking flow in an overlay, so it works on top of your existing design.

<script src="https://static.reservaties.net/widget/widget.bundle.js" data-restaurant-id="YOUR_RESTAURANT_ID"></script>

Without the gift card option

<script src="https://static.reservaties.net/widget/widget.bundle.js" data-restaurant-id="YOUR_RESTAURANT_ID" data-hide-giftcard="true"></script>

Button on the left

<script src="https://static.reservaties.net/widget/widget.bundle.js" data-restaurant-id="YOUR_RESTAURANT_ID" data-position-large="left" data-position-medium="left" data-position-small="left"></script>
  • Paste the script just before the closing </body> tag.
  • Use the optional attributes to set position, theme and language.
  • Add data-hide-giftcard="true" to hide the gift card option in the widget.

Gift card (digital)

Embed the digital gift card flow so guests can buy a gift card online and receive it by email. Perfect for a dedicated “Gift cards” page on your website.

<iframe src="https://tafelboeken.be/YOUR_RESTAURANT_ID/giftcard-iframe" style="width:100%;height:850px;border:none;"></iframe>
  • Set the height tall enough so the whole form is visible.
  • Guests receive the gift card by email after purchase.
  • Redeem gift cards at the restaurant by scanning the code.

Gift card take-away (pickup)

Embed the gift card flow with a physical pickup option, so guests can buy online and collect a printed card at your restaurant. Includes colour themes to match your site.

<iframe src="https://happy-giftcard.vercel.app?restaurantId=YOUR_RESTAURANT_ID&theme=black" style="border:none;width:100%;height:90vh;"></iframe>
  • Configure your pickup windows in your opening hours first.
  • Change the theme value to match your branding (e.g. black, blue, green, purple).
  • Guests choose between email delivery and in-person pickup.