# Embed Widget

> Add a booking widget directly to your website so visitors can schedule without leaving your page.
> Source: https://linktime.io/docs/developers/embed
> Last updated: February 2026

## Overview

LinkTime's embed widget lets you add scheduling directly to your website. Visitors can browse your availability, select a time, and complete the booking — all without leaving your site.

There are three embed options:

- **Inline Embed** — Full calendar view on your page
- **Popup Button** — Click to open booking modal
- **Direct Link** — Share your booking URL

## Getting Your Embed Code

1. Go to [Event Types](https://linktime.io/dashboard/events) in your dashboard
2. Click the **share** icon on the event type you want to embed
3. Select "Embed" from the sharing options
4. Copy the generated code snippet

## Inline Embed (iframe)

The simplest way to embed your booking page. Add this iframe wherever you want the calendar to appear:

```html
<iframe
  src="https://linktime.io/yourusername/30-min?embed=true"
  width="100%"
  height="700"
  frameborder="0"
  style="border: none; border-radius: 8px;"
></iframe>
```

> **Tip:** Replace `yourusername` with your LinkTime username and `30-min` with your event type slug.

## Popup Button

Add a button that opens your booking page in a modal overlay:

```html
<script src="https://linktime.io/embed.js" async></script>

<button
  data-linktime-url="https://linktime.io/yourusername/30-min"
  data-linktime-style="popup"
  style="background: #0d9488; color: white; padding: 12px 24px;
         border: none; border-radius: 8px; cursor: pointer;
         font-size: 16px; font-weight: 500;"
>
  Book a Meeting
</button>
```

## URL Parameters

Customize the embed behavior using query parameters:

| Parameter | Description | Example |
|-----------|-------------|---------|
| `embed=true` | Enables embed mode (hides nav) | `?embed=true` |
| `name` | Pre-fill invitee name | `&name=John` |
| `email` | Pre-fill invitee email | `&email=john@co.com` |
| `hideHeader` | Hide the profile header section | `&hideHeader=true` |

## Customization

The embed widget automatically inherits your LinkTime branding settings. To customize:

- Go to [Settings > Branding](https://linktime.io/dashboard/settings) to change your brand color
- Upload a logo and set your display name
- Pro users can remove the "Powered by LinkTime" badge

## Responsive Design

The embed widget is fully responsive. For best results:

- **Width:** Set to `100%` for responsive sizing, or a fixed width (min 320px)
- **Height:** Recommended 700px for the full calendar view, 500px minimum
- **Mobile:** The widget adapts automatically to smaller screens

## Troubleshooting

### Widget shows a blank page

Make sure the URL in the iframe `src` is correct and includes `?embed=true`. Check that the event type is published and not archived.

### Widget is cut off

Increase the iframe height. The calendar needs at least 500px of height to display properly. For the full experience, use 700px or more.

### Cross-origin errors in console

The embed uses standard iframes which work across all origins. If you see CORS errors, make sure you're using the `https://` version of the URL.