# Embeds & sharing


# Embeds & sharing

Once your [event types](./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.

## Share a link

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](./booking-page) for that event type.

:::tip[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:

```html
<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.

:::note[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.

:::note[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

- [Your public booking page](./booking-page) — what visitors see in the embed.
- [Event types](./event-types) — the link and settings behind each embed.
- [Routing forms](./routing-forms) — qualify visitors before they reach a booking page.
- [Developers](./developers) — build a fully custom booking experience with the API.