Create & Integrate Booking Buttons To Your Website
Created by Julien Pauthier, Modified on Sun, 26 Feb 2023 at 09:44 PM by Julien Pauthier
Creating, Publishing & Integrating Scheduling Widget Buttons
TABLE OF CONTENTS
- Creating, Publishing & Integrating Scheduling Widget Buttons
- Create a button
- The installation Page
- Publishing to a Website
- Direct URL (or minisite)
- Publishing to Facebook
- Publishing to the Facebook Mobile App
- Email Marketing Campaign
- Email Signature
- Publishing to Twitter
- Publishing to Google My Business
Create a button
To create a booking button, navigate to the Installation page, on this page inside the box titled "Install Online Scheduling" click the button to the right that says Create New, from there name the button, select which company the button is for (or create one if you haven't yet), and click the button in the upper right corner that says Add.
The installation Page
Once the button is created, it will be displayed on the Installation page. Click the Install button to access various integrations:
Note: This document will focus on Online Scheduling, but the process remains the same for the other button types.
This will open a popup window containing pre-generated code ready to be copied and pasted. Here you can see that the Online Scheduling button can be published to a website using HTML or and iFrame, Facebook page, Direct URL, email signature or QR code.
Publishing to a Website
To publish your Online Scheduling button to your website, select Publish beside the button you have created and copy the Website(HTML) or iFrame code.
The Website (HTML) code will display the icon for the Online Scheduling button that was chosen when creating the button, and display your booking widget as an overlay on the page. This integration is responsive: on a mobile device, the scheduling interface will go fullscreen to adapt to the limited screensize.
Here is how your scheduling widget will be shown, when the popin button is clicked:
Note: You can also integrate the button with a picture, an icon or a CSS button of your own, as well as a floating button as shown here.
The iFrame code will display your booking widget embedded within the web page, avoiding the need for your customers to click a button. Your website must take into account the screen size of the user to display the iframe nicely on a handheld device.
Direct URL (or minisite)
Here’s how it looks on a browser:
Publishing to Facebook
Click the Add online scheduling to your facebook page button. On the next page select which Facebook page you would like to add online scheduling to and then click Add Page Tab. After that, from your Facebook, go to your company's Facebook page and find the Schedule Online tab on the left, sign in with your account credentials, and from the dropdown menu select which company you would like the to create bookings for. You will now see the Online Scheduling Widget within your Facebook business page. If you would like to change the order of your tabs, select Manage Tabs.
Publishing to the Facebook Mobile App
To publish a booking button on Facebook Mobile App, navigate to Installation and select Install beside your Online Scheduling button and copy the Direct URL. Next Navigate to your Facebook business page within the Facebook App tap Edit Page and select Add a button.
On the next screen select Book Now and on the next screen paste the Direct URL for your booking button into the section titled "Link to Website or App".
When a customer is viewing your Facebook page on a mobile device, they will now see the Book Now button available.
Email Marketing Campaign
If you use the Email Marketing feature on your account, navigate to Installation, click Install beside the Online Scheduling button, and copy the Email code. Go to the Contacts portion of the platform, select Message Templates located on the left sidebar, choose a template of your choice or create a new template, and paste the email code that was copied earlier.
Select Save, now when you open the template again you will see the Online Scheduling button within the template.
Navigate to Installation, select Install beside your Online Scheduling button, and copy the Direct URL. Open a new browser tab or window and navigate to your email account and find the Signature or Signature Editor section in your settings. Once there, add an image to the signature to represent you button and then, using your secondary click, link the direct URL copied earlier to that image.
Publishing to Twitter
Navigate to Installation, select Install beside your Online Scheduling button, and copy the Direct URL. Go to a URL shortener of your choice and shorten the direct URL copied earlier. Now you can link your scheduling button in a Tweet without consuming precious characters!
Publishing to Google My Business
Please refer to our specific article concerning Google My Business.
Was this article helpful?
Thank you for your feedback
Sorry! We couldn't be helpful
Thank you for your feedback
We appreciate your effort and will try to fix the article