---
title: "Framer testimonial widget — one Embed component"
description: "Framer testimonial widget in one script tag: an Embed component set to HTML. Why the canvas shows nothing, and the plan question answered from current docs."
url: https://testymo.com/integrations/framer
---

[Integrations](https://testymo.com/integrations) ★ Framer

# Testimonials on Framer, in one Embed component

Framer takes the tag in an Embed component with its Type switched to HTML, dropped where the section belongs. Scripts run only in the browser — never in the editor or the preview — so the one habit this platform asks of you is to judge from the published page, and nothing else.

- **Where the tag goes** — An Embed component from the Insert panel — under Elements → Utility — with Type set to HTML and the tag pasted into the HTML field.
- **Plan needed** — No documented plan requirement. Framer's current docs put no gate on the Embed component or Custom Code; what a paid plan buys is a custom domain and publishing without Framer branding.

## 01 Where the tag goes in the Framer canvas

Framer calls it the **Embed component**, and its docs open with the whole route: “Navigate to the Insert menu and search for Embed” — the tile lives under **Elements → Utility**.

1. Open the **Insert** panel and search for **Embed**, or find it under Elements → Utility.
2. Drag the Embed component into the section where the testimonials belong.
3. In the properties panel, switch **Type** from URL to **HTML**. This is the step people miss — the component defaults to URL, and a script tag pasted there goes nowhere.
4. Paste the script tag into the **HTML** field.
5. **Publish.** Framer’s docs are direct about why: scripts execute “only in the browser and not in the editor”, so the canvas will not show the widget and the published page will.

![Framer's Insert panel with the Utility group open and the Embed tile visible](https://testymo.com/integrations/framer-insert-embed.webp)

The Insert panel, Utility group — Embed is the tile with the globe. Screenshot from [Framer’s embed help](https://www.framer.com/help/articles/how-to-add-an-iframe-or-embed-script/).

![The Embed component's properties panel with the Type toggle set to HTML and an empty HTML field](https://testymo.com/integrations/framer-embed-panel.webp)

The Embed component’s properties — Type toggled to HTML, and the field the tag goes in. From [Framer’s Trustpilot walkthrough](https://www.framer.com/help/articles/how-to-embed-trustpilot-widget-into-your-website/).

The Embed is a layer you size like any other, so give it the section’s full width and room to breathe vertically — the widget occupies the layer you drew. Framer’s other route, **Project Settings → Custom Code**, injects code into every page’s head or body: right for analytics, wrong for a visible widget, which needs a spot on the canvas to render at.

## 02 What Framer gates, and what it does not

**The current docs put no plan gate on this.** Framer’s pricing table has no custom-code or embed row on any tier, and the help articles for the Embed component and Custom Code carry no plan-restriction language at all. What the docs do tie to a paid Site plan is the packaging around your site: “Connect a custom domain / Publish your site without Framer branding / Access plan-specific features such as CMS capabilities.”

Worth saying because the internet remembers otherwise: older tutorials — written against Framer’s previous plan structure — claim custom code needs a paid plan. That claim is not in Framer’s current documentation. On the free plan your site publishes on a Framer subdomain with Framer branding, and nothing in the docs says the tag behaves differently there.

Sources

- [Framer — How to add an iframe or embed script](https://www.framer.com/help/articles/how-to-add-an-iframe-or-embed-script/)
- [Framer — How to add custom code](https://www.framer.com/help/articles/how-to-add-custom-code/)
- [Framer — Embedding a Trustpilot widget (scripts run only in the browser)](https://www.framer.com/help/articles/how-to-embed-trustpilot-widget-into-your-website/)
- [Framer — Site plans overview](https://www.framer.com/help/articles/site-plans-explained/)

Plan names and menu labels are the platform’s to change. If what you see differs from what is written here, the linked page is the authority — and [tell us](mailto:support@testymo.com) so this page gets fixed.

## 03 When the widget doesn’t show up

- **The canvas or preview shows an empty box.** — Expected, twice over. Scripts run “only in the browser and not in the editor” — and for the Custom Code route Framer adds that code “added through Settings will not appear in the preview. These changes are only visible on the published site.” Publish, then look at the live page before touching anything.
- **Published, and still nothing.** — Check the **Type** toggle first: it defaults to URL, and a script tag pasted into URL mode is not a URL, so the component renders nothing. Switch to HTML, paste the tag into the HTML field, publish again.
- **The widget is clipped, or ends mid-testimonial.** — The widget lives inside the layer you drew, so a short Embed clips a tall wall. Make the layer taller and republish — and re-check after approving more testimonials, since the set grows and the layer does not. A fixed-footprint design like a carousel or a single quote sidesteps this permanently.
- **Your Framer styles are not affecting the widget.** — They cannot, by design. The widget renders into an open shadow root with its own reset — your site’s styles stay out, the widget’s CSS stays in. Restyle it in the Testymo widget editor; the embed picks the change up on the next page load with no republish in Framer.

## 04 What the one tag actually does

The line you paste is a plain external script. There is no plugin, no app to install, no account to connect on the Framer side, and nothing to configure in the editor afterwards. Testymo generates the tag when you create a widget; the address in it is your widget’s own, and this is the live demo one:

```
<script src="https://testymo.com/w/demo.js" async></script>
```

The server builds that script per request: the rendering code and your approved testimonials arrive together in one response, so the page makes **one request and no follow-up fetches**. The demo tag printed above weighs 16.7 KB of JavaScript, about 6 KB over the wire. That figure covers the demo widget's eight quotes. The testimonials ride inside the script rather than arriving in a second request, so a wall carrying thirty of them weighs thirty quotes' worth of text — measure the embed you paste in, not this one. The [page-speed guide](https://testymo.com/blog/testimonial-widget-page-speed) has the method behind that number, and the case for measuring whatever you embed rather than trusting the category.

It renders into an open shadow root at the exact spot the tag sits, which makes the styling isolation work in both directions: your Framer theme cannot restyle the widget by accident, and the widget’s CSS cannot leak into your page. It sets no cookies, calls no third party, and reads nothing about your visitors. When you approve a new testimonial, it appears on the next page load — you never touch the site again.

## 05 The widget, running on this page

Everything below this line was drawn by that one script tag — the same file, on the same terms, that you would paste into Framer. Eight approved testimonials in the wall design, rendered as a free plan renders them, footer link and all.

## 06 Where to go next

An embed script is one of three ways to put testimonials on a site, and it is not always the right one — a handful of quotes that will not change for a year are better hand-coded. [The full guide to adding testimonials to a website](https://testymo.com/blog/add-testimonials-to-website) prices all three routes: setup, upkeep, and page weight. Once you know the quotes are arriving, [the layout patterns guide](https://testymo.com/blog/how-to-display-testimonials) covers which shape to show them in, and [getting permission first](https://testymo.com/blog/permission-to-use-testimonials) covers the part most sites skip.

The same tag, in another editor

- [WordPress Custom HTML block](https://testymo.com/integrations/wordpress)
- [Webflow Code Embed element](https://testymo.com/integrations/webflow)
- [Wix Embed HTML element](https://testymo.com/integrations/wix)
- [Squarespace Code block](https://testymo.com/integrations/squarespace)
- [Shopify Custom Liquid section](https://testymo.com/integrations/shopify)
- [Ghost HTML card](https://testymo.com/integrations/ghost)
- [Carrd Embed element](https://testymo.com/integrations/carrd)
- [Notion Via Super, or an embed block](https://testymo.com/integrations/notion)
- [Bubble HTML element](https://testymo.com/integrations/bubble)
- [Kajabi Custom Code block](https://testymo.com/integrations/kajabi)
- [Teachable Custom HTML block](https://testymo.com/integrations/teachable)
- [Podia Site-wide code field, or its native section](https://testymo.com/integrations/podia)
- [Skool None — images and links only](https://testymo.com/integrations/skool)

The part before the tag

Pasting the script is the last step, and the easy one. Testymo is the rest: a testimonial form people actually finish, your approval on every word before it goes public, and the permission recorded alongside it. Free to start — no card, no view meters.

[Collect your first testimonial →](https://testymo.com/app?utm_source=integrations&utm_campaign=framer)
