Embed the planning in your website
A studio that already has its own website can show its planning there instead of using the site Le Module provides: this is Plugin mode. Booking, credits, coaches, products and emails work as usual, and the back office stays complete: pages, header, footer and categories serve the booking pages and any page the studio wants to publish (legal notices, discovery offer, event). Plugin mode adds the Integration tab. The mode is chosen in the free trial form, at no extra cost. The two modes are compared in Welcome: the two modes.
To see what it looks like before starting, the demo page shows a studio’s planning live, as it appears inside a website.
Starting a trial of the embedded planning
The free trial form asks which offer to try: choosing the embedded planning opens a studio in Plugin mode, with its public key, a header, a footer and the legal pages, without a home page (the studio’s home is its own website). The link received by email leads to the administration, where four steps remain:
- declare the website’s address in the Integration tab of the settings;
- copy the code to paste and place it on the page of the website that should show the planning;
- create an activity, a coach and a first session;
- receive a first booking, made from the website.
The Integration section of the setup assistant follows these steps and shows the one still to do.
The Integration tab
In Plugin mode, the settings carry an Integration tab. It holds everything needed to show the planning elsewhere:
- The public key, created automatically. It identifies the business in the code pasted into the website and can be published: it grants no permission on its own.
- The code to paste, with the key already filled in, the choice of what it shows, a preview and a Copy button.
- The allowed websites: the addresses of the websites allowed to display the planning.
- The booking address, optional: a subdomain of the studio’s domain (for example reservation.mystudio.com) that keeps customers on the studio’s website.
Preparing the code
Above the code, three lists set what the planning shows. The code updates with each choice.
- Activity: every activity, or a single one. Only the activities visible on the site are offered.
- Coach: every coach, or a single one, with the same rule.
- Language: French or English, for the planning’s labels.
The preview shows the planning as a visitor who is not signed in will see it on the website, with the current choices, and works even before any allowed website is listed. The Copy button puts the code on the clipboard; if the browser refuses, a message says so and the code stays selected for a manual copy. To show one planning per activity, paste one code per activity, in different places of the website.
Two warnings may show: no website is allowed yet (the planning is then shown nowhere), or the business’s own booking address is not ready yet, in which case booking happens at its Le Module address. That optional address is described in Your own booking address.
Allowed websites
The planning is shown only on the listed websites, and nowhere while the list is empty. Each address is written without a path, for example https://www.mystudio.com, and must start with https://. A website reachable both with and without "www" counts as two addresses: list both.
Pasting the code
The code is pasted where the planning should appear, in a "Code" or "HTML" block of the website (on WordPress, the "Custom HTML" block; on Divi, the "Code" module). The planning takes the width of its slot and the website’s text size, up to 16 pixels, and the website’s styling has no effect on it.
The booking address (optional)
This step is optional: do it only if customers should not leave the studio’s website. The booking address is a subdomain of the studio’s domain (for example reservation.mystudio.com). Without it, booking happens at the studio’s Le Module address. Setting it up is described in Your own booking address.
What visitors see
The same planning as the studio’s booking page: the week in columns when there is room, one day at a time (with finger swiping) in a narrow slot, whatever the screen size. Each session shows its time, activity, coach, price in credits and the places taken out of the total. A session that cannot be booked is greyed out: full, too close to its start, too far ahead, or marked unavailable with its reason. Buttons and a calendar change the day or the week, and the planning opens on the next bookable session. Coaches and activities hidden from the site are never shown.
Booking from the website
Clicking a bookable session takes the customer to the studio’s booking address, with the session already chosen. There they sign in, create their account if they have none, and buy credits if their balance falls short: these steps never happen inside the studio’s website. They then confirm the booking and come back automatically to the page of the website they left, where the planning shows "Booking confirmed" with the session’s activity, date and time.
- Throughout the booking, a bar at the top of the page offers "Back to" the studio’s website. It returns to the original page without booking anything. After buying credits, the "Continue with my booking" link of the same bar goes back to the chosen session.
- A session that is full, blocked or too close to its start is refused with the same message as on the booking page, and the way back stays available.
- The return only goes to an allowed website. If the website was removed from the list in the meantime, the customer stays on the booking page.
- With the studio’s own booking address, the customer never leaves the studio’s domain name; without it, booking happens at the studio’s Le Module address, with the same round trip.
Signed-in customers, with your own booking address
Once the studio’s own booking address is ready, the planning recognises a customer already signed in there. They then book and cancel without leaving the studio’s website:
- Above the planning: their credit balance and a link to their customer space. The sessions they booked are marked as on the booking page.
- Clicking a session opens the same booking window as on the booking page: price, balance, companions when the studio accepts them. The booking follows the same rules, with the same messages, and sends the same emails.
- A booking that can still be cancelled carries a cross: cancelling happens right there, within the studio’s cancellation deadline, and gives the credits back.
- Signing in, creating an account and buying credits always happen at the booking address, with the round trip described above. A customer who is not signed in finds a "Sign in" link above the planning; a customer whose balance falls short, a "Buy credits" link in the booking window.
- If the customer’s information cannot be loaded, the planning says so and booking goes through the booking address: a balance is never shown as zero by mistake.
This only works when the website and the booking address share the same domain name (www.mystudio.com and reservation.mystudio.com), and only on allowed websites. Without an own booking address, every booking goes through the round trip.
Regenerating the key
The Regenerate the key button replaces the key immediately. Pages carrying the old one no longer show the planning but a message saying it is unavailable, until their code is replaced with the new one. Keep it for a key copied onto an unwanted website: the list of allowed websites is usually enough.