Your website is the digital storefront of your business. It's where first impressions are made and where your schedule begins to fill up. To help you provide a seamless experience for your clients, Salonized offers flexible ways to integrate your booking widget, whether you prefer a pop-up button or an open version (inline). Follow the guides below and discover how to add it to the most common website platforms.
How can I add the booking widget pop-up button to my website?
Adding the booking widget button to your website is quick and easy. To do it, follow these steps:
Step 1: Adjust the settings for your booking widget
Log in to Salonized
Click the gear icon (Settings) on the bottom-left
Select Online bookings
Click ‘Styling and sharing’ and adjust the following settings if necessary:
Color: Use the default one or choose your own widget color.
Schedule view: Display your availability by week or month.
You can also show an option for customers to check their appointments or add a custom alert in your widget.
Step 2: Copy the code
Scroll to the bottom of the page.
Under ‘Sharing’, select ‘Code to add the button on my website’.
Choose the button position (aligned to the left or right).
Click ‘Copy’ to copy the entire script.
Step 3: Add the code to the footer of your website
Log in to your website management system.
Add the copied code to the footer of your website.
Publish the changes. The widget is now added to your website.
Important: If you update your widget’s color or position in Salonized, a new code will be generated. To see those changes on your site, simply replace the old script with the updated version.
How can I add the booking widget pop-up button to my WordPress website?
Copy the booking widget code from Salonized as described above.
Log in to your WordPress website.
Click ‘Plugins’ on the left menu. (If you don't see this option, your account may not have admin permissions—your website manager can help you with this!)
Click ‘Add New Plugin’
In the search bar, type ‘WPCode.’
Click ‘Install Now’ > ‘Activate’.
You will now see a new menu item on the left called ‘Code Snippets’. Hover over it and select ‘Header & Footer’.
Scroll down to the Footer section and paste your Salonized code into the text box.
Click ‘Save Changes’ at the top, and you’re done.
How can I add the booking widget pop-up button to my WIX website?
Copy the booking widget code from Salonized as described above.
Log in to your WIX website.
Go to Settings in the left-hand menu.
Scroll to the Advanced section.
Select Custom Code.
Find the Body - End section and click ‘Add Code’.
Paste the code from Salonized into the top box (‘Paste the code snippet here’).
Name the tool (e.g., ‘Salonized booking widget’).
Check that the default options are correct (‘Add code to: All pages’, ‘Load code once’, and ‘Place code in: Body - end’).
Click ‘Apply’ to publish your changes.
How can I add the booking widget pop-up button to my Jimdo Creator website?
Copy the booking widget code from Salonized as described above.
Log in to your Jimdo website.
Choose the correct site.
Click ‘Edit’.
Scroll all the way down to the gray area and hover your mouse over it.
Click ‘Add content’ > ‘More elements and add-ons’.
Select the HTML element.
Paste the Salonized code into the HTML element.
Click ‘Save’.
How can I add the booking widget pop-up button to my Weebly website?
Copy the booking widget code from Salonized as described above.
Log in to your Weebly website.
Click ‘Edit website’.
In the top bar, go to ‘Settings’.
Click ‘SEO’ in the left-hand menu.
Go to ‘Footer code’ and paste your Salonized code there.
Click ‘Save’ > ‘Publish’.
How do I link a custom button to the booking widget using WordPress?
You can trigger the booking widget from any menu item or button on your site by using a unique “anchor link”. You have various options to set it up:
Option A: Add it to your main menu:
Log in to your WordPress account.
Go to Appearance > Menus.
Select Custom Links from the left-hand column.
In the URL field (https://static-widget.salonized.com/loader.js), type: #sz-booking-toggle.
In Link Text, type your desired button name (e.g., "Book Now").
Click ‘Add to Menu’ and then ‘Save Menu’.
Option B: Add it to a button on a page:
Open the page editor with the old button.
Select your button or highlight the text you want to link.
Click the hyperlink icon.
In the URL field (https://static-widget.salonized.com/loader.js), enter: #sz-booking-toggle
Click ‘Update’ or ‘Save’ to confirm your changes.
How do I link a custom button to the booking widget using WIX?
How do I add the Open (Inline) Booking Widget to my website?
The ‘Open’ or ‘Inline’ version allows you to embed the full booking experience directly into the body of a webpage. Unlike a pop-up button, this version stays visible on the page (e.g., your homepage or a dedicated booking page), allowing customers to start scheduling immediately without any extra clicks. To add it, follow these steps:
Step 1: Adjust the settings
Log in to Salonized
Go to ‘Settings’ > ‘Online bookings’ > ‘Styling and sharing’:
Choose your color.
Choose the sharing option ‘Code to add an open booking widget on my website’.
Choose the size: you can keep ‘Fit automatically’ enabled or ‘Custom width’.
Adjust the height size if necessary.
Step 2: Copy the code
Click ‘Copy’ at the bottom of the page.
Note: These settings affect the script. Set your preferences before copying the code. If you change settings, you must replace the code on your site.
Step 3: Add the code to your website
To add the open booking widget to Weebly:
Log in to Weebly and click ‘Edit website’.
Go to ‘Pages’ and select the desired page.
Click </> (Embed Code) and drag it to the desired position.
Click ‘Edit Custom HTML’ and paste your code.
Click ‘Publish’ to save your changes.
To add the open booking widget to Mijndomein:
Log in to Mijndomein
Go to ‘Products’.
Select ‘Manage’ next to Websitemaker
Click ‘Login Websitemaker’.
Go to the page you want to add the widget to.
In the ‘Widgets’ menu, click ‘HTML’ and drag it onto the page.
Click ‘Add your custom HTML here’, delete the placeholder text, paste your code, and click ‘Update’.
Click ‘Republish’ at the top right.
And you’re done! You have successfully added your open booking widget to your website.
If you have any questions or need further assistance, contact us via chat or at (+31) 020 893 2386.
For more information about the online booking widget, take a look at this article.