> ## Documentation Index
> Fetch the complete documentation index at: https://docs.updates.page/llms.txt
> Use this file to discover all available pages before exploring further.

# Embeds Overview

> Show your latest posts inside your app or website

# Embeds

Bring your changelog directly into your product with an embeddable posts panel.

<Note>
  Embeds are available on the **Business** plan.
</Note>

## How embeds work

An embed is a single script tag you paste into your site. It renders a trigger button where the tag is placed, and clicking the button opens a slide-over panel showing your latest posts — users never have to leave your app to see what's new.

## Why embed?

<CardGroup cols={2}>
  <Card title="Keep users in your app" icon="window">
    Users don't have to leave to see what's new
  </Card>

  <Card title="Increase visibility" icon="eye">
    More users see your updates when they're in-context
  </Card>

  <Card title="Drive engagement" icon="message">
    A "What's new" entry point catches attention
  </Card>

  <Card title="Seamless experience" icon="puzzle-piece">
    Configure theme, colors, and copy to match your app
  </Card>
</CardGroup>

## Creating an embed

<Steps>
  <Step title="Go to Embeds">
    In the dashboard, navigate to **Account → Embeds**
  </Step>

  <Step title="Create new embed">
    Click **New Embed** and give it a name
  </Step>

  <Step title="Configure">
    Use the embed editor to set the theme, placement, colors, button label, and heading text
  </Step>

  <Step title="Copy the script tag">
    The dashboard generates a unique script tag for your embed — copy it and paste it into your site before the closing `</body>` tag
  </Step>
</Steps>

The script tag looks like this (always copy the exact tag from your dashboard — it contains your embed's unique ID):

```html theme={null}
<script type="text/javascript" src="https://.../<embed-id>.js"></script>
```

→ [Full installation guide](/embeds/widget)

## Customization

All embed customization happens in the dashboard embed editor — no HTML attributes or custom CSS required. You can configure:

* **Theme** — light or dark
* **Placement** — left, center, or right
* **Panel size**
* **Colors**
* **Button label**
* **Heading text**
* **updates.page badge** — show or hide

→ [Customizing your embed](/embeds/styling)

## Triggering from your own UI

Prefer to open the panel from your own button, link, or menu item? Set the embed's action style to **custom** in the dashboard and use the JavaScript API:

```javascript theme={null}
window.UpdatesPage.open("<embed-id>")
```

→ [JavaScript API](/embeds/inline)

## Managing embeds

You can create multiple embeds for different use cases — for example, one for your main app and one for your marketing site, each with its own theme and copy.

Edit or delete embeds anytime in **Account → Embeds**.