1. Prerequisites
1.1. Having a secure site
Your website must be secured with HTTPS. A green or grey padlock followed by the mention "https" allows you to determine if your site is secure.
If your site is not in HTTPS, you can switch your site to HTTPS by following this tutorial.
1.2 Domain name
If your website domain is wordpress.com, wix.com, etc. you will not be able to add the booking widget Smeetz to your website. These hosts do not allow users to add JavaScript code to sites if they do not have their own domain name.
Your site may have been created with Wordpress or Wix. However, you must be the owner of your domain name to add the Smeetz booking widget.
2. Installing the Smeetz widget
Follow the steps below to install the Smeetz widget, depending on your web provider.
Remember to create and configure this widget beforehand from your Smeetz account (See: Create a booking widget).
2.1 Integrating the Smeetz Widget on your website
Smeetz offers two main ways to integrate its widget on your website: Standard Embed and Advanced Integration. Each has its own behavior and use cases.
A. Standard Embed (Simple Integration)
Uses a
<div>that the Smeetz script fills automatically.The widget always fetches the latest data from Smeetz.
Changes in Smeetz (e.g., new events, prices, or availability) update automatically on your site—no need to touch the code.
This makes it highly dynamic and low-maintenance. ✅
How to use:
Copy the provided embed code.
Paste it into your website.
The widget will appear inline and stay up-to-date automatically.
B. Advanced Integration
Uses an
<a>link with anonclickscript to open the widget in a lightbox or popup.The integration hardcodes product IDs, categories, and options.
Any changes in Smeetz (new products, categories, or updates) require manually updating the code on your website.
This approach is less dynamic because the widget shows a fixed snapshot of your Smeetz setup at the time of embedding. ❌
How to use:
Click on “Advanced Integration” in Smeetz.
Copy the provided code.
Paste it into your website.
Users must click the link to open the widget.
Remember to update the code manually whenever Smeetz changes are made.
2.1 Integrating the iFrame Smeetz on your Wix site
Login to your Wix account.
Go to your Site Manager.
Click on Monitoring and Analytics.
Click on New tool and choose from the Custom drop-down list.
Set your code.
Paste the received code into the iFrame snippet.
Choose the corresponding domain if you have several domains
Choose a name for your code.
Add a code to pages: Define on which pages to add this code (All pages / Choose specific pages).
Choose where the code extract should be placed in the code of your site.
Click on Apply.
2.2 Integrating the iFrame Smeetz on your Wordpress site
Login to your WordPress account.
Install the Header & Footer plugin.
Paste the code received just after opening the tag <body>.
Save the configuration.
2.3 Integrating the iFrame Smeetz on your Webself site
Login to your Webself account.
Choose the page where you want to install the iFrame Smeetz.
Click on an element of the page to add content.
Select the Script option.
Go to the bottom of the window.
Paste the code received in the iFrame snippet to the location shown in the previous illustration: Paste code between <body> and </body> tags.
💡 Our widget has a hidden feature that you can use if you want to allow your visitors to apply a promocode from your website directly when opening the widget. You simply need to add the following attribute to your widget embed code and add the promocode from the your website’s input as its value, like the following :
data-smtz-vouchers="YOUR_CODE_HERE"
</aside>