This article covers:
Locating your iframe embedding code
To find your iframe code:
Open your Public page and select Customise Page:
Find the HTML code for your page section, containing the codes for a Button link, a Standard link, and an Embedded iframe.
Select Embedded iframe and copy the code in the box:
Embedding the iframe on your website
To embed your Bookwhen schedule into your Squarespace website:
Open your Squarespace page. While in edit mode, insert an Embed content block section where you would like your Bookwhen schedule to appear.
Select the
< / >
icon. A new box will open labelled Embed Data. In this box, paste the code copied from your Embedded iframe, then select Set, then Apply:You can also use the width and height tools in this section to adjust the size of your schedule. However, we recommend using the widest setting to ensure your entire schedule is visible.
When you're happy, save your changes. Once published, your Bookwhen schedule will be embedded on your website and ready for customers to use.
Other information about the iframe
The iframe is fully responsive to mobile devices and should work on any device. To maximise the mobile experience, we recommend keeping event names and descriptions short to minimise scrolling.
The iframe only displays your schedule, events, and alert banner. It does not include banner images, buttons, the footer, or any other custom page edits.
Troubleshooting appearance issues: If your iframe doesn't display correctly, another element on your website may be interfering with the code. We recommend reaching out to your website manager for troubleshooting.
Troubleshooting the iframe button codes
Some website builders, such as WordPress, may treat the Button link and Standard link codes as iframes. This can cause issues, requiring the links to open in a new tab or window.
Fix: If your links aren’t working as expected, use an amended version of the HTML code with
target="_blank"
to ensure they open in a new tab.
An example of how to adjust the code:
Button link
Default:
<a href="https://bookwhen.com/example" title="Book online"><img src="https://d1abtw6bgq2xi2.cloudfront.net/images/bookonline_button.png" alt="Book online" style="width:105px;height:22px;" /></a>
Amended (opens in a new tab):
<a href="https://bookwhen.com/example" target="_blank" title="Book online"><img src="https://d1abtw6bgq2xi2.cloudfront.net/images/bookonline_button.png" alt="Book online" style="width:105px;height:22px;" /></a>
Standard link
Default:
<a href="https://bookwhen.com/example">Book online</a>
Amended (opens in a new tab):
<a href="https://bookwhen.com/example" target="_blank">Book online</a>
💬 Need extra help?
For the quickest response, contact us via live chat on our homepage or your account. Buddy, our trusty chatbot, will assist first and pass you to a support team member if needed.
Prefer email? Send us an email instead.
Thank you! 🕺
Tags: square, integrate, embed, website