If you already have a clinic website, patients can book without leaving it. Atlacare gives you two pieces of code to paste in:
- Inline booking page: the full booking page sits inside one of your pages and grows to fit, so there are no scroll bars inside your page.
- Book now button: a button that opens the booking page in a pop-up over your site. You pick the wording and the colour.
Embedding is included on the Clinic and Practice plans. On every plan you can still link to your booking page from your website.
Step 1: tell Atlacare which websites can show it
Go to Settings → Embed on your website (only the owner or a manager can change it).
- Under Your website addresses, enter your website's address starting with
https://, for examplehttps://www.yourclinic.co.uk. Enter just the address, without a page path. - If your site opens both with and without
www, add both. You can add up to five addresses, which leaves room for a test or staging copy of your site. - Click Save websites.
Your booking page will only show on the websites you list. Anyone else who tries to put it on their site just gets a blank frame, so nobody can pass your booking page off as theirs. Changes reach your website within about a minute.
Addresses must start with https://. Wildcards (such as *.yourclinic.co.uk) aren't accepted, so list each address on its own.
Step 2: copy the code
Once an address is saved, the two code boxes on the same page come alive. Click Copy code on the one you want.
The inline booking page code looks like this (yours has your clinic's address in it):
<div data-atlacare-booking="your-clinic">
<a href="https://atlacare.com/book/your-clinic" target="_blank" rel="noopener">Book an appointment with Your Clinic</a>
</div>
<script src="https://atlacare.com/embed.js" async></script>
The Book now button code looks like this:
<a href="https://atlacare.com/book/your-clinic" target="_blank" rel="noopener"
data-atlacare-book-button="your-clinic"
data-colour="#4F46E5">Book now</a>
<script src="https://atlacare.com/embed.js" async></script>
Change the button's wording and colour in Settings before you copy it, and the preview shows how it will look. If the script can't run (some site builders strip scripts), both pieces of code still work as an ordinary link to your booking page.
WordPress
Block editor (most WordPress sites):
- Open the page in the editor and click + where you want the booking page or button.
- Search for and add a Custom HTML block.
- Paste the code and click Update (or Publish).
- Open the live page to check it. The editor preview doesn't always run scripts.
Page builders (Elementor, Divi and similar): add the builder's HTML or Code element and paste the code into it.
On WordPress.com, some plans remove scripts from Custom HTML blocks. If the button turns into a plain link, your plan doesn't allow scripts. The link still works, or you can upgrade your WordPress.com plan.
Wix
Wix places pasted code inside a frame of its own, on a different web address from your site, so the pasted code doesn't work on Wix. Use Wix's website embed instead:
- In the Wix editor, click Add Elements → Embed Code → Embed HTML.
- Click Enter Code, choose Website Address, and paste your booking page address, for example
https://atlacare.com/book/your-clinic. You'll find it under Booking page address in Settings → Embed on your website. - Drag the box to the size you want. Make it tall, around 900 pixels, as it won't resize itself here.
- In Atlacare, list your Wix site's address under Your website addresses. If your site uses a free Wix address as well as your own domain, add both.
- Publish, then check the live site. The Wix editor itself can't show the booking page, because it runs on Wix's address, not yours.
For a button on Wix, add a normal Wix Button and link it to your booking page address, opening in a new tab.
Squarespace
- Edit the page, click Add Block (or +) and choose Code.
- Paste the code and make sure Display Source is off.
- Save and publish, then check the live page.
Squarespace only runs scripts in code blocks on some plans. On other plans the code still works as a link to your booking page. While you're building the site, add your built-in Squarespace address (the one ending in .squarespace.com) as well as your own domain, so you can check it before you go live.
Other website builders
Any builder that lets you paste HTML works: look for an HTML, Code or Embed block. If your builder only accepts a web address to embed, use your booking page address, and set the height by hand.
Troubleshooting
The frame says the page refused to connect, or stays blank. The website's address isn't on your list, or isn't exactly the same. Check for www, and check that you saved. Changes take up to a minute. If you moved to a plan without embedding, the booking page stops showing on other websites. Your saved addresses are kept for when you upgrade again.
It works on my live site but not in the editor. That's normal for most builders: their editor runs on their own address, not yours. Check the published page.
The button is a plain link. Your builder removed the script. The link still opens your booking page in a new tab.
Privacy
Atlacare doesn't add tracking or cookies to your website. The booking page inside the frame works the same as your normal booking page, with no analytics and no cookie banner. Patients' details go straight to Atlacare over a secure connection. Your website never sees them.