Help / Booking pages

Embedding on your website

Instead of sending people to 42min.us/..., you can put a booking page or a routing form on your own website: inline in a page, or as a popup that opens from a link or a button. Both codes use one small script, embed.js, which also passes your page's campaign parameters to the embed and its events to your own tags.

Getting the code

• Event type: open the event type and click Share at the top. Under Add to your website, the panel has the Inline Form and Link that opens a popup codes.
• Routing form: open the routing form and go to its Share tab.

Above the codes, Send events to picks where the embed sends its events on your website: None, Google Tag Manager, Google Analytics or Meta Pixel. The choice goes into both codes as one more attribute, data-x42min-push. See Events from embeds.

Inline

<div data-x42min-embed="https://42min.us/your-username/intro-call" data-x42min-title="Intro call"></div>
<script src="https://42min.us/embed/embed.js" async></script>

Paste it where the scheduler should appear. The script turns the div into a frame that takes the full width of its container, up to 900 pixels for a booking page or 640 for a routing form, and 720 pixels high.

Popup

<a href="https://42min.us/your-username/intro-call" data-x42min-popup>Schedule a meeting with me</a>
<script src="https://42min.us/embed/embed.js" async></script>

Change the link text to anything you like, or put data-x42min-popup on a link of your own. A click opens the page in a dialog over yours. Escape, the close button or a click outside the dialog closes it. A click with Ctrl, Cmd or Shift held opens the page in a new tab or window, as with any link.

The script only needs to be on a page once, however many embeds the page has.

What the script does

• It passes these campaign parameters from your page's address to the embedded page, so a booking records where the visitor came from: utm_source, utm_medium, utm_campaign, utm_term, utm_content, gclid, gbraid, wbraid, fbclid, msclkid, ttclid and li_fat_id. Nothing else from your address is passed.
• It sends the embed's events to your page and, with Send events to, into that tag.
• It binds the popup links itself, with no inline onclick, and styles the popup from a stylesheet on https://42min.us, with no inline styles. The codes therefore work on a website with a strict Content Security Policy, as long as that policy allows https://42min.us in script-src, style-src and frame-src.
• It only shows pages of https://42min.us, and only listens to them.

Codes from before

Codes copied before embed.js existed keep working. A plain <iframe> still shows the page, and its events still reach your page as messages. To pass your page's campaign parameters to it, or to push its events into a tag, replace it with the new inline code.

The old popup code, with popup.js and an onclick, still opens the popup, and it already passes campaign parameters, because popup.js loads embed.js. Replace it with the new popup code only to push its events into a tag with Send events to.

Common pitfalls

• The embed shows nothing. Your site, or a security setting such as a strict Content-Security-Policy, may block the script, its stylesheet or the frame. Allow https://42min.us in script-src, style-src and frame-src.
• The popup link opens the page instead. The embed.js script tag has to be on the page. Without it the link is an ordinary link to the booking page, a fine fallback but not the popup you wanted.
• Editing the URL in the code by hand. Don't. Copy the code again if you change the event type's slug or your username, so the embed always points at the right page. A code pointing anywhere but https://42min.us shows nothing.
• Branding mismatch. The embedded page uses your organization's branding. Set that up so the embed matches your site.