This article is for the Legacy version of Appointlet. Click here to browse the knowledge base on the most recent app version.
Don't love our amazing button designs? That's ok! Here's how you can use your own button.
Let's start by looking at the website embed code:
<script src="https://d35xd5ovpwtfyi.cloudfront.net/loader/loader.min.js?v=1440696613" async defer></script>
<img data-appointlet-organization="..." src="https://d35xd5ovpwtfyi.cloudfront.net/loader/buttons/008DBD.png?v=1440696613">
The <img...>
portion draws the button on your site, so it's what needs to be replaced with the custom button. The important thing to note about it is the data-appointlet-organization="..."
part. Any HTML element that has this attribute will become click-able and opens the booking page.
With that in mind, let's do some examples:
Plain Link:
<script src="https://d35xd5ovpwtfyi.cloudfront.net/loader/loader.min.js?v=1440696613" async defer></script>
<a href="#" data-appointlet-organization="...">Book Now</a>
Image:
<script src="https://d35xd5ovpwtfyi.cloudfront.net/loader/loader.min.js?v=1440696613" async defer></script>
<img src="/path/to/image" data-appointlet-organization="...">
Button:
<script src="https://d35xd5ovpwtfyi.cloudfront.net/loader/loader.min.js?v=1440696613" async defer></script>
<button type="button" data-appointlet-organization="...">Book Now</button>
Related Articles
Link Directly to a Meeting Type and Member
Share booking link on a site:
Share booking link with an email signature:
Gmail: Adding Appointlet to Your Signature
Mail.App: Adding Appointlet to Your Signature