Install the booking button on your website

You do not need a programmer for this, and you do not need to understand the code. You copy two pieces of text from Rentalbuddy and paste them into your website. This guide explains exactly where each one goes and what to do when the button doesn't show up.

The two pieces, and why you need both

Piece	What it does	Where it goes
Copy booking engine code (the script)	Loads Rentalbuddy on your website	Once for the whole website, in your site-wide code/footer settings
Copy button code (the button)	Marks the exact spot where the button should appear	On the page where you want the button

Neither one works alone. The script with no button code loads Rentalbuddy but shows nothing. The button code with no script leaves an empty space on the page. This is the most common mistake — operators copy only the button code and wonder why nothing happens. (The one exception: email links to unlock or extend a booking work without a button.)

Before you start

The booking button is set up per location, so do this for each location that should have a button on your website.

Step 1 — Open the Book button setup

1. In the left menu, open Locations.
2. Click the location you want.
3. Open the Book button tab.

Step 2 — Choose how customers book

Under Where do customers book?, choose My own website.

Then under How do customers book from your website?, choose Embedded on your website — this is the option that gives you the button code. (The other option, Booking link, just gives you a link to a Rentalbuddy-hosted page and needs no code at all. If you are not sure you can install code, that is a perfectly good alternative.)

Step 3 — Tell Rentalbuddy which website builder you use

Under Which website builder do you use?, pick your builder from the list — WordPress (three variants), Wix, Squarespace, GoDaddy Website Builder, Webflow, Jimdo, IONOS (MyWebsite), or Other / I'm not sure.

This does not change the code. It changes the instructions shown next to each step so they match your builder's menus. Pick Other / I'm not sure if nothing fits — you still get general instructions.

Step 4 — Add the script to your website (once)

In step Add the booking engine to your website, click Copy booking engine code. You get a single line that looks like this:

<script defer src="https://plugin.rentalbuddy.io/static/js/main.js"></script>

Always use the Copy button rather than typing this by hand — the copy gives you the exact address your account uses.

Paste it into your website's site-wide code area, at the end of the page body. In website builders this field is usually called custom code, header/footer code, tracking scripts, or something that mentions "before </body>". Rentalbuddy's own wording under this step: "Loads Rentalbuddy on your website. Add this once per website address."

Roughly where to look in the common builders (menu names change, so treat these as a starting point):

• WordPress — WordPress has no built-in field for this. The in-product guide recommends installing a small free plugin such as Insert Headers and Footers or WPCode and using its Footer / "before </body>" field. If you use a cache plugin, clear the cache after saving.
• Wix — Site & app settings → Custom code (sometimes under Tracking & Analytics), placement Body – end, applied to All pages.
• Squarespace — Settings → Advanced → Code injection → Footer. Not all Squarespace plans include code injection.

Then save and publish your site.

Paste the script only once. Extra copies are ignored, so a duplicate will not break anything — but it slows the page and makes it unclear which copy to replace if you later need the cookie-banner or async version described further down. If you are not sure whether it is already there, search your site-wide code fields for rentalbuddy before adding another copy.

One website with several pages: paste it once, site-wide. Several separate websites: paste it once on each website.

Step 5 — Enter your website address

In step Place the button where it should show you will find the field URL where book button is implemented. Enter the full address of the page where your button will be — for example https://yoursite.com/booking.

Rules the system enforces:

• It must start with https:// or http://. Without that, saving fails with "The URL must start with https:// or http://."
• It must not contain a ?. This usually happens when you paste a preview or test link. Delete everything from the ? onwards.
• It is required. Without it you cannot save the location in embedded mode.

This field matters more than it looks. Rentalbuddy builds the links it sends in emails — start rental, return, extend, reschedule — by taking this address and adding information to it. If the address points at a page that does not contain the button code, your customers land on that page and never reach their PIN code or the return step. If you change the address mid-season, links already sent out will point at the old page.

Step 6 — Put the button on the page

Still in Place the button where it should show, click Copy button code next to Standard booking. You get one line like this:

<div id="rentalbuddy-checkout" data-site="your-location-id"></div>

Paste it into the page itself — into an HTML / Embed / Code block in your page editor, at the exact spot where the button should appear. Not into the site-wide settings; that is where the script from step 4 went.

Under Advanced (only if needed) there are two more button codes: Product booking and Event booking. Use those only if your location offers both products and events and you want a button that skips the choice. Otherwise Standard booking is the right one.

Save and publish the page.

Step 7 — Check it

1. Click Save in Rentalbuddy.
2. Click Preview next to the booking option — it opens your website in a new tab with the booking flow so you can check that embedding works.
3. Also open your page normally, in a private/incognito window, so you see it as a customer does and not from cache.

The button's text and look

Two things about the button's appearance surprise almost everyone.

If you never set a text, the button says BOOK — in capitals. That is the built-in fallback label, not a styling choice you made. Give it a proper label under Button text on the same tab:

• For this location: switch on Customize for this location and fill in Default text. Under Advanced settings there are separate Product text / Event text fields for the advanced button codes.
• For all locations at once: use Edit text for account.

Two behaviours to know. With Customize for this location off, the account texts are used and the location fields are not even shown. And clearing every location field while the switch is on also quietly falls back to the account texts.

Your website's stylesheet can restyle the button. The button is a plain button element on your page. Its colours and fonts are set directly on the element, so ordinary site styles do not change those — but rules marked !important, and properties the button leaves unset (such as uppercasing text), do come through. So if the text shows in capitals even though you typed normal letters, that is your site's stylesheet, not Rentalbuddy. Use Button styling (same tab) to set its look explicitly, and check the result with Preview.

Text and styling changes do not require re-copying any code — they take effect the next time the page is loaded.

What the red mark actually means

The Book button tab (and the Book button URL column on the Locations list) shows a red mark until setup is complete — and operators routinely fight it in the wrong place, because of one misunderstanding:

The red/green mark never looks at your website. Rentalbuddy does not visit your site or detect whether the code is installed. The mark only reflects what is saved in the admin:

• Embedded on your website: green once a valid URL where book button is implemented is saved (starts with http(s)://, no ?).
• Booking link: always green.
• The Rentalbuddy-hosted website option: green once that website is switched on.

So if the mark "stays red even though the button is on our site": the website is irrelevant — an unsaved, empty or invalid URL field is the cause. Fill it, press Save, and it flips. The tooltip tells you which case you are in: "Choose how customers book and finish book button setup." (nothing chosen or URL missing) or "The URL must start with https:// or http://." Conversely, a green mark does not prove the code is on your site — Preview is the tool that actually opens your page and shows whether the button works.

Common gotchas

A cookie-consent banner is blocking the script

If you use a cookie banner, it may hold the Rentalbuddy script back until the visitor accepts cookies — so the button appears late or not at all. Rentalbuddy warns about exactly this: "If the booking button does not appear and you use a cookie banner, your site may be blocking the script until visitors accept cookies."

Under Advanced (only if needed) → Cookie consent tools there are ready-made versions of the script for two common tools: Copy for Cookiebot and Copy for OneTrust. Replace the script you pasted in step 4 with the matching one.

For any other cookie tool: in your cookie banner's settings, mark the booking script (or the host plugin.rentalbuddy.io) as strictly necessary or essential. You do not need to recategorize individual cookies.

The button appears but behaves strangely

Under Advanced (only if needed) → Script loading you can copy two alternative versions of the same script: Copy with async and Copy without defer. Try one of them instead of the standard one — again, replacing the copy you already pasted, never adding another.

You want a button on a second page

The script is already loaded site-wide, so you only need the button code. Paste the same button code into an HTML/Embed block on the other page.

Note that the URL where book button is implemented field holds one address per location. Choose the page you want customers sent to from booking emails — that is the page the email links will open.

You want a button on a second language version of your page

Same as above: paste the button code into the language version of the page. If the second language lives on a separate website (a different domain), that website needs its own copy of the script.

Which languages the booking window itself offers is a separate setting on the location — see Account settings — where every setting lives.

You have more than one location

Each location has its own button code (the data-site value differs) and its own website address. Copy the button code from that location's own Book button tab. The script itself is the same for all of them, so it still goes in only once per website.

Checklist: the button doesn't appear

Work down this list in order.

1. Are both pieces installed? The script in the site-wide settings, and the button code on the page. Missing script is the most common cause.
2. Did you publish? Most builders need an explicit Publish/Update after saving, and cache plugins need clearing.
3. Is the script there more than once? Search your site-wide code fields for rentalbuddy. Remove every copy but one.
4. Is the location set to embedded booking? Open Locations → the location → Book button and confirm My own website → Embedded on your website is selected and saved. If the Book button tab shows a red warning, the saved setup is incomplete — see What the red mark actually means above; it is about the saved URL field, never about your website.
5. Is the website address valid? It must start with https://, must not contain a ?, and should be the page that actually has the button code.
6. Is a cookie banner blocking it? Try the Cookiebot or OneTrust version of the script, or mark it as strictly necessary in your cookie tool.
7. Try a different load option. Swap the script for the async or without defer version.
8. Check on a phone and in a private window. Cached pages and browser extensions can hide it.
9. Is anything actually bookable? The button can be installed correctly and still have nothing to sell if the location has no open period or no products. The customer does not see a blank window in that case — they see "This rental station is currently not available for booking." with your location's contact details. See Opening hours and open dates and Customers see no available times, or no products at all.
10. Still stuck? Send support your page address and say which builder you use — the two things that decide everything above.