# Creating Embeds

- URL: https://betteranalyst.com/docs/embeddings/creating-embeds
- Updated: 2026-11-12
- Author: Better Analyst

Create, configure, and deploy Better Analyst embedded chat widgets on your website. Get the iframe code with responsive sizing and installation examples.

Learn how to create, manage, and deploy embeddable Better Analyst chat widgets on your website.

![Better Analyst Embedded Analytics](https://betteranalyst.com/screenshots/embed-light.png)

Embedded analytics in light and dark mode

## Accessing the Embeddings Dashboard

1. Log in to Better Analyst
2. Click **Embeddings** in the sidebar
3. You'll see the Embeddings management dashboard

New embed configurations are available on Team (1 embed) and Enterprise (unlimited). Eligible legacy plans retain their existing embed access.

## Creating a New Embed

1. Click the **New Embed** button in the top-left
2. A new embed is created with the default name "New Embed"
3. The embed is automatically selected and ready for configuration

## Managing Embeds

### Renaming an Embed

1. Click the pencil icon next to the embed name
2. Enter your new name
3. Click outside the input or press Enter to save

### Selecting an Embed

Click any embed in the list to select it. The selected embed is highlighted and its configuration appears alongside the appearance preview.

### Deleting an Embed

1. Hover over the embed you want to delete
2. Click the trash icon
3. Confirm the deletion

Removing an embed disables its installed links and revokes member access. Billing reconciliation is queued. Historical records are retained for recovery and reconciliation.

## Getting the Embed Code

Once you've configured your embed:

1. Find the **Install & test** section in the right panel
2. The iframe code is displayed in a code block
3. Click the **Copy** button to copy to clipboard

The embed code looks like this:

```html
<iframe
  src="https://app.betteranalyst.com/embed/your-embed-id"
  width="100%"
  height="600"
  frameborder="0">
</iframe>
```

## Embedding on Your Website

### Basic Installation

Paste the iframe code wherever you want the chat to appear in your HTML:

```html
<div class="chat-container">
  <iframe
    src="https://app.betteranalyst.com/embed/your-embed-id"
    width="100%"
    height="600"
    frameborder="0">
  </iframe>
</div>
```

### Responsive Sizing

For a full-height embed, use CSS:

```html
<style>
  .chat-container {
    width: 100%;
    height: 100vh;
  }
  .chat-container iframe {
    width: 100%;
    height: 100%;
    border: none;
  }
</style>
```

### Fixed Position Widget

For a floating chat widget in the corner:

```html
<style>
  .chat-widget {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 400px;
    height: 600px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    border-radius: 12px;
    overflow: hidden;
  }
</style>
```

## Best Practices

### Sizing

- Minimum recommended height: 500px
- For full functionality, use at least 600px height
- Width should be at least 350px for mobile compatibility

### Performance

- Load the iframe after your main content for better page performance
- Consider lazy loading for embeds below the fold

### Security

- Only embed on domains you control
- The embed URL is unique to your account

## Next Steps

- [Customization](https://betteranalyst.com/docs/embeddings/customization) - Brand your embed with custom colors and logos
- [Users & Connectors](https://betteranalyst.com/docs/embeddings/users-and-connectors) - Manage user access and data