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

# Testimonial widgets: layouts and display

> Widgets are embeddable components that display your approved testimonials on any website. Each widget has a unique script tag, layout options, and analytics.

A widget is how your approved testimonials appear on your website. You create and configure it in KudosWall, then copy a single `<script>` tag and paste it into your site's HTML. From that point on, the widget loads and displays your testimonials automatically — no rebuilds required when you approve new ones.

## How embedding works

Each widget you create gets a unique ID. KudosWall generates an embed snippet that looks like this:

```html theme={null}
<script
  src="https://kudoswall.org/widget.js"
  data-id="YOUR_WIDGET_ID"
  async
></script>
```

Paste this snippet wherever you want the widget to appear — on your landing page, pricing page, or anywhere else on your site.

<Tip>
  You can create multiple widgets and configure each one differently. For example, one widget showing all testimonials on your homepage and another filtered by a specific tag on a product page.
</Tip>

## Layout options

Three layouts are available. Masonry and carousel are premium features that require Pro or above.

| Layout   | Available on          | Description                                                                     |
| -------- | --------------------- | ------------------------------------------------------------------------------- |
| Grid     | All plans             | Testimonials in a clean, uniform column grid                                    |
| Masonry  | Pro, Agency, Lifetime | Variable-height cards in a flowing multi-column layout                          |
| Carousel | Pro, Agency, Lifetime | Horizontally scrolling display with optional auto-advance and navigation arrows |

## Theme options

The widget supports three themes:

* **Light** — white card backgrounds with dark text
* **Dark** — dark card backgrounds with light text
* **Auto** — follows the visitor's operating system preference

## Filtering and curation

You control exactly which testimonials appear in each widget:

<CardGroup cols={2}>
  <Card title="Filter by tag" icon="tag" href="/reference/widget-settings-reference">
    Show only testimonials that have a specific tag attached.
  </Card>

  <Card title="Filter by minimum rating" icon="star" href="/reference/widget-settings-reference">
    Set a minimum star rating so only your highest-rated responses appear.
  </Card>

  <Card title="Max items" icon="list-ol" href="/reference/widget-settings-reference">
    Limit how many testimonials the widget displays. Defaults to 20.
  </Card>

  <Card title="Pinned testimonials" icon="thumbtack" href="/reference/widget-settings-reference">
    Choose specific testimonials that always appear first, regardless of sort order.
  </Card>
</CardGroup>

## Branding options

<Warning>
  Removing the "Powered by KudosWall" badge requires a Pro, Agency, or Lifetime plan. On Free, the badge is always shown.
</Warning>

| Option               | Available on          |
| -------------------- | --------------------- |
| Accent color         | Pro, Agency, Lifetime |
| Background color     | Pro, Agency, Lifetime |
| Hide KudosWall badge | Pro, Agency, Lifetime |

## Animation

The widget supports two animation styles when testimonials load:

* **Fade** — cards fade in smoothly (default)
* **None** — cards appear instantly with no transition

## Widget analytics

Every widget automatically tracks how it performs. From the widget's analytics view in your dashboard, you can see:

* **Views** — how many times the widget has been loaded on your site
* **Clicks** — how many visitors clicked a link or CTA inside the widget
* **Click-through rate (CTR)** — clicks divided by views, expressed as a percentage

<CardGroup cols={2}>
  <Card title="Create a widget" icon="plus" href="/widgets/create-widget">
    Step-by-step guide to creating your first widget in the dashboard.
  </Card>

  <Card title="Widget settings reference" icon="sliders" href="/reference/widget-settings-reference">
    Full reference for every layout, filter, and display option.
  </Card>
</CardGroup>