Add Mangomint online booking to your website
The part of Mangomint worth using is not the single booking button. It is the direct links, one per staff member, per service and per category, which let each page on your site book the specific thing that page is about.
Quick answer
Open the Settings app in Mangomint, go to Online Booking, then Setup and Integration, and switch online booking on. Copy the script tag from that screen into the header of your site, then copy your booking link and use it as the URL behind your booking buttons. Both halves are needed: the script makes booking open in place, and the link is what the button points at. Beyond the main link, Mangomint generates direct links for individual staff members, services and service categories, which is what lets a specific treatment page book that treatment instead of dropping the client at a general menu.
Which Mangomint link belongs on which page
| Link type | Put it on | What the client sees |
|---|---|---|
| Main booking link | Header, footer, home page | Your full service menu |
| Service category link | A category page, e.g. colour | Only services in that category |
| Individual service link | A single treatment page | That treatment, preselected |
| Staff member link | A stylist's bio page | That person's availability |
Step-by-step
- 1
Switch online booking on first
Settings app, then Online Booking, then Setup and Integration, and enable the toggle. Nothing you install will work until this is on, and the links it generates do not exist before you do it. While you are there, check which services are actually marked bookable online — an empty booking screen on a live site is worse than no button.
- 2
Put the script tag in your site header
Copy the script tag from that same screen and paste it into the HTML header of your site, so it loads everywhere. On Wix that is Settings, then Custom code, then Add Custom Code. On Squarespace it is Pages, then Custom Code, then Code Injection, into the header box. On WordPress, the usual route is a headers-and-footers plugin rather than editing the theme directly, which survives your next theme update.
- 3
Use the booking link as your button URL
Copy your booking link and set it as the destination of any button or menu item you want to open booking. This is an ordinary URL, so it works in every website builder without special support — the script tag is what upgrades the experience once the link is clicked.
- 4
Give each page its own direct link
Most people skip this step. It's the one that pays. Generate a direct link for each service, category or staff member, and use it on the matching page. A client reading about balayage should get a booking screen with balayage already selected, not your entire menu. It takes a few minutes per page and measurably reduces drop-off between reading and booking.
Tips & best practices
- Direct links are also the right thing to put in an Instagram bio or a Google Business Profile when you are promoting one specific service.
- Check your service names read like something a client would recognise before you expose them. Internal shorthand that made sense at the front desk looks cryptic on a booking screen.
- If you have stylists with very different followings, the per-staff links are worth putting on their individual bio pages. People book the person as often as the service.
Common questions
Do I need the script tag if I already have the link?
+−
The link alone works and will take clients to booking. The script tag is what lets booking open in place instead of sending them away, so it is worth adding, but a plain link is a perfectly functional starting point.
Where do I find the direct booking links?
+−
They are generated per staff member, service and service category from within Mangomint's online booking settings, alongside the main link. Each one is a normal URL you can put behind any button.
Will this work on a site I did not build myself?
+−
The link half will, anywhere you can edit a button. The script tag needs access to the site header, so if someone else maintains your site you may need to send them the snippet and ask for it to go in the header.
Can clients book a specific stylist?
+−
Yes, either by choosing one on the main booking screen or by arriving through that stylist's direct link, which opens straight into their availability.