Skip to main content

Embeds & sharing

Once your event types are set, getting booked is all about getting your page in front of people. You can share a plain link anywhere, or embed your booking page right inside your own website.

Every event type has its own link, made from your handle and the event slug — for example calendar.imatic.ai/book/priya/intro-call.

  1. Open the event type (or find it in your list).
  2. Use Copy link.
  3. Paste it into an email, your email signature, a social bio, a chat message — anywhere.

That link opens your public booking page for that event type.

One link per meeting

Share the specific event-type link for the meeting you want, rather than a generic page. Sending the "Intro call" link means invitees land straight on the right meeting.

Embed your booking page​

Want people to book without leaving your site? Embed your booking page inline, so it appears as part of your page.

imatic Calendar provides a small embed script, embed.js. Point it at your handle and event type with data-user and data-event-type, and add it to your site's HTML where you want the booking page to appear:

<script
  src="https://calendar.imatic.ai/embed.js"
  data-user="<your-handle>"
  data-event-type="<event-slug>"
  data-target="#book-here"
></script>

data-user and data-event-type are required. The optional data-target is a CSS selector for the element the inline frame mounts into; omit it and the frame renders right where the script tag sits. The script renders your booking page as an inline frame, and it's responsive — it fits the width of wherever you drop it. Your visitors pick a date, choose a slot, and book without ever leaving your website.

Where to get your exact snippet

Use the embed option in your dashboard to copy the snippet pre-filled for your handle and event type, then paste it into your site's page where you want the booking widget to show.

More ways to embed​

Inline isn't your only option. The same embed.js script supports a few modes — pick the one that fits your page:

  • Inline — the booking page sits in a container on your page (above).
  • Popup / modal — a button opens your booking page in an overlay above your page, so it doesn't take up space until someone wants to book.
  • Floating badge — a fixed "Book a time" pill in the corner of every page, like the badge widgets you've seen on other sites.
  • Click any element — add data-imatic-cal-link="handle/event-type" to a link or button you already have, and clicking it opens your booking page. No extra button needed.

All modes accept a theme (light or dark) and a primaryColor so the widget matches your brand, and the inline frame auto-resizes to fit its content as the visitor moves through the flow.

Copy the exact snippet

Use the embed/share option in your dashboard to copy the ready-made snippet for the mode you want — it comes pre-filled with your handle, event type, and options.

Next steps​