Embed a 24sessions booking form
The out-of-the-box 24sessions booking forms allow you to embed beautifully branded booking forms to your own website with low effort. Customers can use these forms to schedule a video call with your team.
The main benefit of the embedded booking forms is that the customer don’t need to navigate to a different page, as you can display them on your own website or service. Adding the embedded booking forms is quick and simple.
∞ Introduction
The booking forms can be embedded by inserting a code-snippet to your website.
There are two types of meetings in 24sessions: live-now and scheduled meetings.
The live-now functionality allows a guest to request a meeting instantly. The user, the host of the meeting, will need to accept this meeting request. Once accepted, the meeting is created and both parties can join the meeting.
Unlike the live-now meetings, the scheduled meetings are scheduled without a meeting request. These meetings take place in a given time in the future.
The embedded booking form supports both live-now and scheduled meetings. If a meeting type supports both live-now and scheduled meetings, the live-now form will be shown only if one or more users are online and otherwise the scheduled booking form is shown.
The booking form can be embedded in three ways: per meeting type, per user, and per group.
∞ Per meeting type
Embedding a booking form per meeting type is recommended in situations where meetings are scheduled for an available user from a group of users.
As an example, teams that manage a set of clients can be added to a specific meeting type. When the guest schedules a meeting, an available user is automatically selected.
∞ Per user (host of the meeting)
Embedding a booking form per user is recommended in situations where meetings are scheduled for one individual user. For example, this can be embedded to a personal booking page.
∞ Embed a booking form for a meeting type
∞ Step 1: Get the code
∞ a. Meeting type
From the 24sessions portal, you can find code snippets for embedding meeting type specific booking forms.
From the meeting type settings, click on Embed to view and copy the code snippet.
∞ b. User (optional)
Modify the below code snippet with the following:
- Instance name
- User id
- Webpageslug (link to definition)
- Meeting type
<div id="24s-user-<user-id>"></div>
<script data-cfasync="false">(function () {var w = window;var d = document;function l() {var s = d.createElement('script');s.type = 'text/javascript';s.async = true;s.id="24-s-script";
s.src = "https://<your-instance>.24sessions.com/js/widget_code.js?v=1.80";
s.setAttribute('data-url', "https://<your-instance>.24sessions.com/<webpageslug>/<meeting-type>?embed=true");var x = d.getElementById('24s-user-<user-id>');x.appendChild(s);}if (w.attachEvent) {w.attachEvent('onload', l);} else {w.addEventListener('load', l, false);}})();</script>
∞ Step 2: Place the code on your website
Find a suitable place in the HTML of your website and insert the code snippet. Vóila!