Guide for dive centers and web designers

Requests, Leo and online check-in on your website

One line of code, then you set up everything in Diver ID. Works with WordPress, Wix, Webflow, Squarespace, Jimdo and many other website builders.

STEP 1

Turn it on in Diver ID

Requests & bookings › Website. Choose what should appear on your website and set the color and frame.

STEP 2

Paste one line

Copy the code into your website builder. Further down you find the clicks for each website builder.

STEP 3

Publish and test

Open your page once. Diver ID then shows “Last seen on” with the address of your website.

What you can add

Leo, the chat

A bubble in the corner, on every page of your website. Leo answers questions in the guest’s language and knows your answers from Diver ID.

Request form

Guests request dates, courses and number of people in a clear form. It opens as a window right on your website.

Online check-in

A button guests use to check in before they arrive. They fill in certification, health and signature at home.

Price list

Your prices from Diver ID as a list on a page of your website. Change a price in Diver ID and it is right on your website too.

The code

This line goes on every page of your website, ideally at the end before </body>. In Diver ID your own code already replaces YOUR-CODE.

<script src="https://www.diver-id.net/gc/w.js" data-code="YOUR-CODE" async></script>

You find your code in Diver ID under Requests & bookings › Website.

Buttons and price list in a specific place

If the request button, the check-in button or the price list should appear in a specific place, put a placeholder there. The line above still has to be on the page.

Request button

<div data-diverid="request-button"></div>

Check-in button

<div data-diverid="checkin-button"></div>

Price list
```
<div data-diverid="prices"></div>
```

Your own booking button

You already have a button like “Book now”? Keep it and use your request link as its address, for example:

https://www.diver-id.net/r/YOUR-CODE

If the line above is on the page, the form opens with your code as a window right on your website, even if the button would otherwise open a new tab. Without the line, the link opens the request page.

The clicks for your website builder

Everything works Code for the whole website is possible.
Certain plans Code only in certain plans, otherwise buttons with links.
Links only No custom code possible, you use buttons with links.

WordPressEverything works

Copy the code in Diver ID: Requests & bookings › Website.
Paste the code: On one page: “Custom HTML” block. For all pages: a plugin for header and footer code. With Elementor Pro: Elementor › Custom Code › location “body, end” › entire site. On WordPress.com only with a plan that allows plugins.
Button or price list in a specific place: “+” › “Custom HTML” block › paste code › Update (administrators only).
Your own booking button: “+” › “Buttons” block › enter text › link icon › paste link. Use your request link as the address.
Publish and open the page once.

WixCertain plans

Only works with a Premium plan and your own connected domain. In the “Embed HTML” element Leo stays trapped in a small box. If you change the domain, the code is gone.

Copy the code in Diver ID: Requests & bookings › Website.
Paste the code: Dashboard › Settings › Custom code › “+ Add Custom Code” › All pages › Body, end › Apply.
Button or price list in a specific place: Add › Embed code › “Embed HTML”. The code runs in its own frame there.
Your own booking button: Click the button › link icon › Web address › paste link › Done. Use your request link as the address.
Publish and open the page once.

SquarespaceCertain plans

Code Injection is only available on the Core, Plus and Advanced plans.

Copy the code in Diver ID: Requests & bookings › Website.
Paste the code: Website Tools › Code Injection › Footer › paste code › Save.
Button or price list in a specific place: Add a “Code” block. With a script only on the Core, Plus and Advanced plans.
Your own booking button: Edit › Add block › Button › pencil › Attach link › paste link › Save. Use your request link as the address.
Publish and open the page once.

Jimdo CreatorEverything works

Copy the code in Diver ID: Requests & bookings › Website.
Paste the code: Menu › Settings › Edit head › paste code › Save.
Button or price list in a specific place: Add element › More elements › Widget/HTML.
Your own booking button: Add element › Button › link icon › external address › Save. Use your request link as the address.
Publish and open the page once.

Jimdo (new website builder)Links only

Jimdo does not allow your own code here. For enquiries simply use a second button with the enquiry link, Leo is already built in there.

Copy the request link in Diver ID: Requests & bookings › Website.
Button with a link: Edit website › eye icon on the block › tick “Primary Button” › chain icon › paste address.
For check-in, add a second button with the check-in link.
Publish and tap both buttons once yourself.

WebflowCertain plans

Your own code only works with a paid site plan, not on the free Starter plan.

Copy the code in Diver ID: Requests & bookings › Website.
Paste the code: Site settings › Custom code › Footer code › Save › Publish.
Button or price list in a specific place: “Code Embed” element, only with a paid site plan.
Your own booking button: Select the button › Settings › Link › address. Use your request link as the address.
Publish and open the page once.

Google SitesLinks only

Google Sites locks your own code into a frame. For enquiries use a second button with the enquiry link, Leo is already built in there.

Copy the request link in Diver ID: Requests & bookings › Website.
Button with a link: Insert › Button › name and link › Insert › Publish.
For check-in, add a second button with the check-in link.
Publish and tap both buttons once yourself.

IONOSEverything works

Copy the code in Diver ID: Requests & bookings › Website.
Paste the code: Settings › Custom Head Code › paste code › Save.
Button or price list in a specific place: Elements › “+” › HTML module › code (not in all packages).
Your own booking button: Select the button › Link › Website › paste address. Use your request link as the address.
Publish and open the page once.

STRATOEverything works

The STRATO help partly still describes the old website builder. If the menus have other names, use the enquiry link as a button.

Copy the code in Diver ID: Requests & bookings › Website.
Paste the code: Settings › General › Tracking code › “Insert in: HEAD” › Save.
Button or price list in a specific place: Content elements › Standard elements › Embed › embed code.
Your own booking button: Link dialog › “External website” › paste address. Use your request link as the address.
Publish and open the page once.

GoDaddyLinks only

For enquiries use a second button with the enquiry link, Leo is already built in there.

Copy the request link in Diver ID: Requests & bookings › Website.
Button with a link: Section › Action Button › Link › website address.
For check-in, add a second button with the check-in link.
Publish and tap both buttons once yourself.

ShopifyEverything works

After a theme update the code in theme.liquid can be missing. Then paste it again.

Copy the code in Diver ID: Requests & bookings › Website.
Paste the code: Online Store › Themes › Edit code › theme.liquid › paste before </body> › Save.
Button or price list in a specific place: “Custom Liquid” section, if your theme has it.
Your own booking button: Customize theme › section › button block › label and link. Use your request link as the address.
Publish and open the page once.

HostingerEverything works

Copy the code in Diver ID: Requests & bookings › Website.
Paste the code: More (⋯) › Integrations › Custom code › Save › Update website.
Button or price list in a specific place: Add elements › Embed code › paste code.
Your own booking button: Button › Edit › Link › address › Update website. Use your request link as the address.
Publish and open the page once.

one.comCertain plans

Your own code only on the Premium and Business + E-commerce plans.

Copy the code in Diver ID: Requests & bookings › Website.
Paste the code: More › Code › choose placement › paste code › “Apply to all pages” › Publish.
Button or price list in a specific place: More › Code, only Premium and Business.
Your own booking button: Button component › Link. Use your request link as the address.
Publish and open the page once.

Other website builderEverything works

Copy the code in Diver ID: Requests & bookings › Website.
Paste the code: Look for “Custom Code”, “Code Injection”, “Footer Code” or “Head Code”. Leo also works in the head section.
Button or price list in a specific place: Look for “HTML”, “Code” or “Embed”.
Your own booking button: Almost every website builder has a button element: enter the link there. Use your request link as the address.
Publish and open the page once.

Frequently asked questions

Do I have to paste the code again when I change something?

No. You change the color, texts and what is shown in Diver ID. Your website picks that up by itself, without new code.

Can I keep my own booking button?

Yes. Use your request link as the address of your button. If the code is on your page, the form opens as a window right on your website.

My website builder does not allow code. What now?

Then use buttons with links: one with the request link, one with the check-in link. If Leo is turned on for you, he is on the request page.

Where do the requests end up?

In Diver ID under Requests & bookings, in the Requests tab.

Can my web designer do it?

Yes. In Diver ID, “Send to web designer” emails the code and a link to this guide.

Does adding it cost anything?

Adding it to your website costs nothing.