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

# Embed Widget

> Display your approved testimonials on any website with one script tag.

The BragBox widget renders your approved testimonials on any website — no developer required. Paste one script tag, configure everything from your dashboard.

## Get your embed snippet

In your dashboard, open a campaign and copy the embed snippet from the **Embed** panel:

```html theme={null}
<script
  async
  src="https://bragbox.one/widget.js"
  data-bragbox-id="your-widget-id"
></script>
```

Paste it anywhere in your page HTML where you want testimonials to appear. That's the whole integration.

## Appearance is set from your dashboard

Layout, theme, accent color, and testimonial limit are all configured in **Settings → Widget Appearance** — not in the script tag. Changes you make there go live immediately, with no need to update your embed code.

<Note>
  See [Widget Appearance](/publishing/widget-appearance) for a full walkthrough of the dashboard settings.
</Note>

## Script tag attributes

`data-*` attributes on the script tag **override** your dashboard settings on a per-page basis. Use them only when you need a specific variant on one page — for everything else, the dashboard defaults apply automatically.

| Attribute         | Options                       | Default           | Description                            |
| ----------------- | ----------------------------- | ----------------- | -------------------------------------- |
| `data-bragbox-id` | —                             | —                 | **Required.** Your widget's public ID. |
| `data-layout`     | `marquee`, `carousel`, `wall` | Dashboard setting | Override the layout for this page.     |
| `data-theme`      | `light`, `dark`               | Dashboard setting | Override the color scheme.             |
| `data-limit`      | `1`–`50`                      | Dashboard setting | Override max testimonials shown.       |

### Layouts

| Layout     | Description                                                                                |
| ---------- | ------------------------------------------------------------------------------------------ |
| `marquee`  | Horizontal auto-scrolling strip. Works well at any section width.                          |
| `carousel` | One testimonial at a time, cycling every 7 seconds. Clean and focused.                     |
| `wall`     | Masonry grid — all testimonials visible at once. Best for a dedicated "Wall of Love" page. |

### Override example

A homepage uses dashboard defaults (marquee, light), but a dark landing page needs a carousel:

```html theme={null}
<!-- homepage — no attributes, reads layout & theme from dashboard -->
<script async src="https://bragbox.one/widget.js"
  data-bragbox-id="your-widget-id"></script>

<!-- dark landing page — carousel override -->
<script async src="https://bragbox.one/widget.js"
  data-bragbox-id="your-widget-id"
  data-layout="carousel"
  data-theme="dark"></script>
```

## What displays

The widget shows only **approved** testimonials. New approvals appear automatically — no snippet update required. Each card shows the customer name, role and company (if provided), and testimonial text.

## Placement tips

* Place it on your homepage, services page, or a dedicated testimonials page
* Marquee and carousel work at any section width; the wall layout needs at least 600 px to look good
* The widget runs in a sandboxed iframe — it won't interfere with your page's styles or scripts

## Platform guides

<CardGroup cols={2}>
  <Card title="WordPress" href="/publishing/wordpress" icon="wordpress" />

  <Card title="Wix" href="/publishing/wix" icon="w" />

  <Card title="Squarespace" href="/publishing/squarespace" icon="square" />

  <Card title="Custom site" href="/publishing/custom-site" icon="code" />
</CardGroup>