This article is for:
Once you've set up online booking, you're ready to connect it to your website. You have a few options to choose from – a book now button at the top of your website, a unique link within your site, or a widget so the booking process sits inside your website. Then clients will be able to make a booking directly from your website.
This guide teaches you how to:
Step-by-step instructions
1 Click Setup then Booking buttons.
2 To create a general booking option, select All for each option.
Add Book now button
A book now button will open the booking process on top of your website.
1 Go to section 2, select Book now button.
If you're adding your own image, ensure you have the URL of the image you want to use.
2 Choose the style of your button.
3 Check you're happy with the preview.
4 Copy the top line of code and add this to your website. Make sure this snippet is included before the button snippet.
5 Copy the bottom line of code and add this to your website. Add this where you would like the button to appear.
You will need to have administrative access to your website to do this. If you don’t have access, or aren't comfortable using your website editor, you can pass the code to your website developer/designer to add for you.
Add a booking link
This is a simple link or URL that you can share with customers online. It can be added as links to text and images on your website, social media profiles, email campaigns, or in SMS.
1 Select Book now link in section two.
2 Copy the URL from section three and paste it on your website, or anywhere online that you advertise your services.
Add a booking widget
The booking widget adds a booking calendar directly onto your website, keeping clients on your site for the entire booking process.
1 Select Booking widget in section two.
2 Adjust the pixel width and height.
3 Check you're happy with the preview.
4 Copy and paste the code into your website editor.
You will need to have administrative access to your website to do this. If you don’t have access, or aren't comfortable using your website editor, you can pass the code to your website developer/designer to add for you.
Make your widget mobile-friendly
You'll need to adjust the code so your clients can see the entire widget on their mobile phone.
1 The original code will look something like this:
2 Change the width value from 480px to 100% in your website code editor. For example:
<iframe src="//beautydayspa1.gettimely.com/book/embed?" scrolling="no" id="timelyWidget" style="width:100%;height:500px;border:1px solid #4f606b"></iframe>
You will only need to adjust the width values, not the height, to make it mobile-friendly.