Implement the Tebi Widget on your website
When starting with Tebi Reservations and/or Takeaway sales, the best way to showcase this to your guests is by installing the Tebi Widget on your website or by using a landing page.
For the reservation widget data, like the snippet code and the url share link for a landing page, you can find these in your Tebi Back Office > Reservations > Widget.
For the takeaway widget date, in this case only the snippet code, you can find this in your Tebi Back Office > QR Ordering > Takeaway.
We do not offer any options to configure the behavior and appearance of the widget. The language of the booking experience is either Dutch or English depending on the browser language of the guest.
How to install the widget on your website
You can integrate the widget by adding the embedded snippet code inside the <body> tag of your website.
Insert the code into the footer, optimizing the loading of custom code as it will not block content load.
In Reservations > Widget you can find snippet code for a widget button and a url share link that you can use as a landing page. This share link you can also use for other websites and social media profiles, like your Instagram Bio.
WordPress
Install the Tebi widget for Wordpress via plugin or in the footer of your website. Make sure you are always logged in as an Administrator, or else you can add the embedded code or install the plugin.
Install the Tebi Reservations plugin into your WordPress. Read here all the steps you can take to install the widget successfully.
Squarespace
Note: You can only add the embedded code in the footer if you have a Business subscription. It is not possible to add the reservation widget to your Squarespace website on a personal plan.
- Visit your Squarespace admin dashboard via the /config screen.
- Click Website > Pages > Website Tools > Code Injection.
- Inject the Tebi embedded code in the Footer > Save.
- To inject the code you go to Advanced > Code Injection > add the Tebi code to the Footer block.
- You can also create a button in Squarespace when you edit the pages. Make sure you use the custom links from the Widget page in Tebi.
Wix
- Log in on Wix.
- Select the website you want to place the widget.
- Choose Settings in the menu on the left, scroll down to Advanced, and select Custom code.
- Select Add Custom code in the top right. By adding the script, you can install the widget on all pages.
- Paste the code that you’ve copied from the configuration page into the code snippet box at the top.
- Now select Add Code to Pages All Pages Load code on each new page.
- For Place Code in select Body - end.
- Now click Apply to implement your Tebi Widget.
Install Multi-location Widget
If you have multiple locations and you want to work within one widget across your various websites, you can start using the multi-location widget.
To create this multi-location widget you need to have two or more Tebi Accounts. Go to your Tebi Back Office > Reservations > Widget > “Select multiple locations +”. Once the multiple locations are selected, you can copy the code in the Back Office and inject this on your website.