Testimonial widget for Webflow
To add a testimonial widget to Webflow, paste two lines of code into a Code Embed element and publish. Vouchjar gives you that code plus a link that collects testimonials from your customers, so the wall fills up while you decide what goes live.
Live demo: this is the real widget running sample testimonials.
What you’re adding
A Vouchjar wall is two parts:
- A collection link. You send it to clients or customers. They write a few lines, pick a star rating and can add a photo. Nothing appears anywhere until you approve it.
- An embed. One
<div>and one<script>tag that show your approved testimonials on your Webflow page as a grid, a carousel or a single quote.
You don’t need to rebuild a section in the Designer every time a new testimonial comes in. Approve it in your dashboard and it shows up on the live site.
Add it to Webflow in five steps
1. Create a free wall
Sign up with your email (no password, no card) and name your wall after your site. The free plan covers one wall and five approved testimonials.
2. Collect testimonials
Copy your collection link from the dashboard and send it to a few happy customers. If you already have praise on X or LinkedIn, copy the post and paste it into Import in your dashboard. Vouchjar reads the name and text out of what you paste, and you check it before saving.
3. Approve the ones you want
Every submission lands in your dashboard switched off. Tick Show on wall for the ones you’d like on your site.
4. Add a Code Embed in Webflow
In the Webflow Designer:
- Open the Add panel and find Code Embed in the Advanced section.
- Drag it onto the page where the testimonials should go. Putting it inside a Div Block or Container makes spacing easier.
- Paste the embed code from step 3 of your dashboard. It looks like this, with your wall’s ID instead of
your-wall:
<div data-vouchjar="your-wall"></div>
<script src="https://vouchjar.com/embed.js" async></script>- Click Save & close.
5. Publish and check the live site
Publish, then open the live URL. The Designer canvas only shows a placeholder for custom code, so the published site is where you’ll see the wall.
Which layout suits which Webflow page
Add data-layout to the <div> to switch layouts:
| Layout | Add this | Good for |
|---|---|---|
| Grid | nothing (it’s the default) | A dedicated testimonials or “wall of love” page |
| Carousel | data-layout="carousel" | A homepage section where height matters |
| Single | data-layout="single" | Next to a pricing table or signup button |
Using the same wall on several pages? Paste the <div> wherever you need it. One <script> tag per page is enough.
Webflow CMS or a widget?
You can build testimonials natively with a CMS collection and a Collection List. Here’s an honest comparison:
| Webflow CMS | Vouchjar widget | |
|---|---|---|
| Styling | Full control in the Designer | Neutral cards, light or dark |
| Getting testimonials in | You type each one in yourself | Customers submit through a link, or you paste from X/LinkedIn |
| Approval step | Your own draft/publish flow | Built in: nothing shows until you approve it |
| Updating the page | Edit the CMS, then publish | Approve in the dashboard, live within a minute |
| Cost | Included with CMS-capable plans | Free for 5 testimonials, then $8/month |
If you already keep testimonials in the CMS and love how they look, stick with it. If the hard part is getting testimonials and keeping the page up to date, a collection link plus a widget saves the busywork.
Plan check
Webflow only allows Code Embed elements on a paid Site plan, or on a Core, Growth, Agency or Freelancer Workspace plan. On the free Starter plan you can still set up your wall and collect testimonials. Add the embed once the site is on a paid plan.
FAQ
- Does a testimonial widget work on the free Webflow plan?
- Not on the free Starter plan. Webflow's Code Embed element needs a paid Site plan, or a Core, Growth, Agency or Freelancer Workspace plan. If you're on Starter, you can still collect and approve testimonials in Vouchjar now and add the embed when you upgrade.
- Do I need the Webflow CMS to show testimonials?
- No. The widget loads its testimonials from Vouchjar, so you don't need a CMS collection or a CMS plan. The CMS is a good option if you'd rather type testimonials in yourself and style every card in the Designer.
- Will it slow down my Webflow site?
- The script is under 5 KB, loads with async so it never blocks the page, and fetches the testimonials after the rest of the page. The testimonial data is cached for a minute at a time.
- Can I style the widget to match my Webflow design?
- Not in detail yet. You get clean, neutral cards in three layouts, plus a dark version if you add data-theme="dark" to the div. The widget renders in a shadow root, so your Webflow classes can't break it and it can't break your page.
- Why is the Code Embed blank in the Designer?
- Webflow shows a placeholder for custom code on the canvas. Publish the site, or use Preview with custom code enabled, and the testimonials appear.
Free for 5 testimonials. No card. Pro is $8/month.
Short version: Webflow install steps in the docs.
Updated October 11, 2026