The Complete Guide to Testimonial Widgets for Framer and Next.js

Building a site on Framer or Next.js usually means you care about performance and design. You want things to look sharp and load fast. The last thing you want is a clumsy plugin dragging down your Lighthouse score or breaking your layout.

But you still need social proof. Here is how to handle testimonial widgets for modern stacks without writing custom CSS from scratch.

The Problem with Standard Embeds

Most legacy testimonial tools give you a heavy iframe. When you drop that into a React environment like Next.js or a design tool like Framer, it often refuses to resize correctly. You end up with scrollbars within scrollbars or massive white space gaps.

The Solution for Framer Users

Framer is visual. You need a widget that behaves like a native component.

1. Grab the Code: In Say About Us, generate your Wall of Love or Carousel.
2. Use the Embed Component: In Framer, press E to drop an Embed.
3. Paste and Lock: Paste the script. Set the width to "Fill" and the height to "Fit Content." This ensures the widget pushes your footer down naturally as more reviews load, rather than getting cut off.

The Solution for Next.js Developers

If you are coding in Next.js, you hate render-blocking scripts.

Instead of pasting the raw script tag directly into your JSX (which will throw hydration errors), use a dedicated Script component from next/script with a lazy load strategy.

This keeps your initial paint fast. The testimonials load in the background only when the user is close to scrolling them into view.

Why We Kept Our Widget Lightweight

We built our widgets to be code-agnostic. Whether you are dragging and dropping in Framer or optimizing distinct server components in Next.js, the Say About Us widget is designed to render cleanly. It adapts to your container, not the other way around. Keep your site fast.

Start collecting Testimonials with Say About Us for just $5 a month. (no hidden fees)