Please make sure you are using at least a Business level plan as we require the CSS and JavaScript capabilities that are not present in the Personal plan.
Overview
To allow customers to book appointments online, a booking button or tab must first be added to the website. After successful installation, clicking this button or tab will trigger a window to slide onto the current webpage. This window called the Self-Booking Overlay, is where the appointment booking happens.
Create the Booking Button(s) or Tab
Multiple buttons can be created and placed in various places on the business website, all of which trigger the opening of the Booking Widget. You may also wish to search the Squarespace Support Center for more detailed instructions.
Create a new booking button or tab
Configure it as a 'web address', using '#book-now' as the URL**
Uncheck the "Open in New Window" option
Click Save
**If you utilize the mobile version of the site, make the URL for the external link section in step 2 the following code instead of '#book-now' -
javascript:blvd.openBookingWidget();
2. Code Injection
Every business has unique HTML code that has already been created. The specific code snippet is located in the Manage Business > Client Experience > Self-booking overlay code. Copy the full code snippet to use for the next step. (This script may already have been provided to you).
In the Home Menu, click Website > Pages > Website Tools > Code Injection
Paste the code into the Header text box, then click Save.
Once the code is injected and saved within the website correctly, clicking the booking buttons should now call the Boulevard self-booking overlay.
For more details, see the specific article from Squarespace.