Changing the button widget

As many of you know, you can install a booking button widget on your site. The booking button widget allows visitors to press a button on all your pages, and then appears a booking overlay, over the page they are on where the appointment can be booked.

The normal booking button is yellow and can be placed at any height on your page by installing the script that can be found in the Design section inside the SimplyBook.me admin interface. Some of our users do not like the yellow button that we provide and want to use a different button. This can easily be achieved by using the following method.

1. Activate the CSS plugin.

2. Go into the plugin settings and select the Widget CSS (not booking page)

3. Insert the following script somewhere in code

#doreserveWidgetButton {
background-position: left center !important;
background-repeat: no-repeat !important;
border: 1px solid white !important;
cursor: pointer !important;
height: 300px !important;
left: auto !important;
opacity: 0.9 !important;
position: fixed !important;
right: auto !important;
width: 40px !important;
background-image: url(http://SOMELINKWHEREYOUHOSTBUTTONIMAGE.com/SomeImage.jpg) !important;
}

You change this link:  http://SOMELINKWHEREYOUHOSTBUTTONIMAGE.com/SomeImage.jpg

to the button image that you want to show instead of the yellow button.

That’s all … !